Page 1 sur 1

intégrer multiple onload

Posté : 09 sept. 2009, 14:38
par fabinounours
bonjour, j'ai un problème sur le chargement de ma page.

je veux faire appel à plusieurs fonctions lors du chargement de ma page.
Seulement il n'y a qu'une seule fonction qui est chargée.

sur ma page prinpale, j'ai ce code :

Code : Tout sélectionner

<script type="text/javascript" src="js/recherche.js" charset="iso_8859-1"></script> <body style="font-family: verdana, helvetica, sans-serif; font-size: 85%" onload="startAll();" > Puis dans mon formulaire, <tr> <td><select name="servergrouplist" id="servergrouplist"> <option value="--">- - - Choisissez un groupe de serveurs - - -</option> </select> </td> </tr> <tr> <td><select name="servicegrouplist" id="servicegrouplist"> <option value="--">- - - Choisissez un groupe de services - - -</option> </select> </td> </tr>
Dans ma page recherche.js j'ai ça :

Code : Tout sélectionner

function startAll() { getServerList(); getServerGroupList(); getServiceGroupList(); } /** * Lister les départements d'une région avec un objet * XMLHTTPRequest. */ /* Création de la variable globale qui contiendra l'objet XHR */ var requete = null; /** * Fonction privée qui va créer un objet XHR. * Cette fonction initialisera la valeur dans la variable globale définie * ci-dessus. */ function creerRequete() { try { /* On tente de créer un objet XmlHTTPRequest */ requete = new XMLHttpRequest(); } catch (microsoft) { /* Microsoft utilisant une autre technique, on essays de créer un objet ActiveX */ try { requete = new ActiveXObject('Msxml2.XMLHTTP'); } catch(autremicrosoft) { /* La première méthode a échoué, on en teste une seconde */ try { requete = new ActiveXObject('Microsoft.XMLHTTP'); } catch(echec) { /* À ce stade, aucune méthode ne fonctionne... mettez donc votre navigateur à jour ;) */ requete = null; } } } if(requete == null) { alert('Impossible de créer l\'objet requête,\nVotre navigateur ne semble pas supporter les object XMLHttpRequest.'); } } function getServerList() { /* À cet endroit précis, on peut faire apparaître un message d'attente */ var messagebloc = document.getElementById('messagebloc'); messagebloc.innerHTML = 'Traitement en cours, veuillez patienter...'; /* On crée l'objet XHR */ creerRequete(); /* Définition du fichier de traitement */ var url = 'fonctions.php?f=1'; /* Envoi de la requête à la page de traitement */ requete.open('GET', url, true); /* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */ requete.onreadystatechange = function() { /* Lorsque l'état est à 4 */ if(requete.readyState == 4) { /* Si on a un statut à 200 */ if(requete.status == 200) { /* Mise à jour de l'affichage, on appelle la fonction apropriée */ var listeServers = requete.responseText; document.getElementById('serverlist').parentNode.innerHTML = '<select id="serverlist" id="serverlist" onchange="getServicesFromServer(this.value);"><option value="--">- - - Choisissez un serveur - - -</option>' + listeServers + '</select>'; messagebloc.innerHTML = ''; } } }; requete.send(null); messagebloc.innerHTML = ''; } function getServicesFromServer(id) { if(id == '--') { document.getElementById('messagebloc').innerHTML = ''; document.getElementById('blocservices').innerHTML = ''; return; } var messagebloc = document.getElementById('messagebloc'); messagebloc.innerHTML = 'Traitement en cours, veuillez patienter...'; /* On crée l'objet XHR */ creerRequete(); /* Définition du fichier de traitement */ var url = 'fonctions.php?f=2&id='+id; /* Envoi de la requête à la page de traitement */ requete.open('GET', url, true); /* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */ requete.onreadystatechange = function() { /* Lorsque l'état est à 4 */ if(requete.readyState == 4) { /* Si on a un statut à 200 */ if(requete.status == 200) { /* Mise à jour de l'affichage, on appelle la fonction apropriée */ var listeServices = requete.responseText; var blocService = document.getElementById('blocservices'); document.getElementById('blocservices').innerHTML = '<select id="serviceslist" id="serviceslist" ><option value="--">- - - Choisissez un service - - -</option>' + listeServices + '</select>'; messagebloc.innerHTML = ''; } } }; requete.send(null); messagebloc.innerHTML = ''; } function getServerGroupList() { /* À cet endroit précis, on peut faire apparaître un message d'attente */ var messagebloc = document.getElementById('messagebloc'); messagebloc.innerHTML = 'Traitement en cours, veuillez patienter...'; /* On crée l'objet XHR */ creerRequete(); /* Définition du fichier de traitement */ var url = 'fonctions.php?f=3'; /* Envoi de la requête à la page de traitement */ requete.open('GET', url, true); /* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */ requete.onreadystatechange = function() { /* Lorsque l'état est à 4 */ if(requete.readyState == 4) { /* Si on a un statut à 200 */ if(requete.status == 200) { /* Mise à jour de l'affichage, on appelle la fonction apropriée */ var GrouplisteServers = requete.responseText; document.getElementById('servergrouplist').parentNode.innerHTML = '<select id="servergrouplist" id="servergrouplist"><option value="--">- - - Choisissez un groupe de serveurs - - -</option>' + GrouplisteServers + '</select>'; messagebloc.innerHTML = ''; } } }; requete.send(null); messagebloc.innerHTML = ''; } function getServiceGroupList() { /* À cet endroit précis, on peut faire apparaître un message d'attente */ var messagebloc = document.getElementById('messagebloc'); messagebloc.innerHTML = 'Traitement en cours, veuillez patienter...'; /* On crée l'objet XHR */ creerRequete(); /* Définition du fichier de traitement */ var url = 'fonctions.php?f=4'; /* Envoi de la requête à la page de traitement */ requete.open('GET', url, true); /* On surveille le changement d'état de la requête qui va passer successivement de 1 à 4 */ requete.onreadystatechange = function() { /* Lorsque l'état est à 4 */ if(requete.readyState == 4) { /* Si on a un statut à 200 */ if(requete.status == 200) { /* Mise à jour de l'affichage, on appelle la fonction apropriée */ var GrouplisteServices = requete.responseText; document.getElementById('servicegrouplist').parentNode.innerHTML = '<select id="servicegrouplist" id="servicegrouplist"><option value="--">- - - Choisissez un groupe de services - - -</option>' + GrouplisteServices + '</select>'; messagebloc.innerHTML = ''; } } }; requete.send(null); messagebloc.innerHTML = ''; }
Quelqu'un aurait il une idée du problème ? je suis totalement bloqué. Je n'arrive pas à afficher le contenu de mes 3 listes déroulantes...

Re: intégrer multiple onload

Posté : 09 sept. 2009, 14:47
par Truc
Salut,

Il manque des bouts... l'appel aux fonctions JS

Re: intégrer multiple onload

Posté : 09 sept. 2009, 14:56
par fabinounours
Salut,

Il manque des bouts... l'appel aux fonctions JS
Ah oui, je préviens d'avance aussi.
Je suis tout sauf développeur :). Donc désolé d'avance si je poste des questions stupides.

Je ne te suis pas (si je peux te tutoyer). (Ou du moins, je ne comprends pas.)

Si j'appelle les fonctions indépemment, une à une, cela fonctionne.

Tu peux m'expliquer Truc? (Ou je dois chercher? J'ai vu ta signature :))

Re: intégrer multiple onload

Posté : 09 sept. 2009, 17:44
par Truc
Donc désolé d'avance si je poste des questions stupides.

Je ne te suis pas (si je peux te tutoyer). (Ou du moins, je ne comprends pas.)

Si j'appelle les fonctions indépemment, une à une, cela fonctionne.

Tu peux m'expliquer Truc? (Ou je dois chercher? J'ai vu ta signature :))
Il n'y a pas de question stupides ou presque
J'imagine que tu as cherché avant de poster ? 8-)

...
...
...
...




tu dois au minimum avoir un appel aux fonction JS du style
<option value="--" onchange="appel_fonction">- - - Choisissez un groupe de services - - -</option>

quel est l'ordre de remplissage des listes ?
sont elles liées (contenu de l'une dépend de la sélection d'une autre) ?

de plus les attributs name et id doivent être unique
<select name="servicegrouplist" id="servicegrouplist">

Re: intégrer multiple onload

Posté : 09 sept. 2009, 18:24
par fabinounours

tu dois au minimum avoir un appel aux fonction JS du style
<option value="--" onchange="appel_fonction">- - - Choisissez un groupe de services - - -</option>

quel est l'ordre de remplissage des listes ?
sont elles liées (contenu de l'une dépend de la sélection d'une autre) ?

de plus les attributs name et id doivent être unique
<select name="servicegrouplist" id="servicegrouplist">
J'appelle mes fonctions dans le <body> je fais un onload="ma fonction qui contient mes fonctions)"

Après, j'ai une liste liée oui.
Les attributs sont uniques.

Sinon j'ai un peu ciblé le problème.
Dans mon premier message, j'ai une fonction function creerRequete()
Mes 3 fonctions font appel à cette dernière.

Si je créé 3 fonctions function creerRequete() avec des noms différents. Ca marche. Ca m'oblige à écrire 3 fois function creerRequete(). C'est lourd et pas très propre...
je ne sais pas comment faire pour corriger cette erreur.