Publicité
+ Répondre à la discussion
Affichage des résultats 1 à 5 sur 5
  1. #1
    Membre régulier
    Femme Profil pro Justine
    Etudiante en informatique
    Inscrit en
    janvier 2013
    Messages
    97
    Détails du profil
    Informations personnelles :
    Nom : Femme Justine
    Localisation : France

    Informations professionnelles :
    Activité : Etudiante en informatique

    Informations forums :
    Inscription : janvier 2013
    Messages : 97
    Points : 73
    Points
    73

    Par défaut Listes liées qui ne fonctionnent pas sous IE 8

    Bonjour à tous,

    J'ai suivit cette discussion sauf que mon problème n'est pas résolu.

    En fait comme le titre l'indique, j'ai une liste déroulante qui est liée via deux fonctions (Ajax/JavaScript) à un input et une autre liste.
    Étonnement il n'y a que la seconde liste qui ne fonctionne pas. Alors que l'input, lui, fonctionne bien.
    Mon code Javascript est le suivant :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    //Cette fonction est appelée via "<script type="text/javascript" src="../JavaScript/javascript.js"></script>"
    function getXhr()
    {
    	var xhr = null; 
     
            if(window.XMLHttpRequest) // Firefox et autres
    	xhr = new XMLHttpRequest(); 
    	else if(window.ActiveXObject)
    	{ // Internet Explorer 
    		try {
    			xhr = new ActiveXObject("Msxml2.XMLHTTP");
    		     } 
    			catch (e) 
    		     {
    			xhr = new ActiveXObject("Microsoft.XMLHTTP");
    		     }
    	}
    	else 
    	{ // XMLHttpRequest non supporté par le navigateur 
    		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
    		xhr = false; 
    	} 
    		return xhr;
    	}
    //les fonctions suivantes sont directement sur la feuille PHP
    function serv() //Ceci est la fonction qui fonctionne très bien (input)
    {
    	var xhr = getXhr();
    	// On défini ce qu'on va faire quand on aura la réponse
    	xhr.onreadystatechange = function(){
    	// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    	if(xhr.readyState == 4 && xhr.status == 200){
    		leselect = xhr.responseText;
    		// On se sert de innerHTML pour rajouter les options a la liste
    		document.getElementById('service').innerHTML = leselect;
    	}
    }
     
    	// Ici on va voir comment faire du post
    	xhr.open("POST","../Ajax/ajaxService.php",true);
    	// ne pas oublier ça pour le post
    	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    	// ne pas oublier de poster les arguments
    	// ici, l'id de la TMA
    	sel = document.getElementById('tma');
    	idtma = sel.options[sel.selectedIndex].value;
    	xhr.send("idtma="+idtma);
    	}
     
    	function sa() //Ceci est la fonction qui ne marche pas (liste déroulante)
    	{
    	       var xhr = getXhr();
    		// On défini ce qu'on va faire quand on aura la réponse
    		xhr.onreadystatechange = function(){
    		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    		if(xhr.readyState == 4 && xhr.status == 200){
    			leselect = xhr.responseText;
    			// On se sert de innerHTML pour rajouter les options a la liste
    			document.getElementById('sous_appli').innerHTML = leselect;
    		}
    	}
     
    		// Ici on va voir comment faire du post
    		xhr.open("POST","../Ajax/ajaxApplication.php",true);
    		// ne pas oublier ça pour le post
    		xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    		// ne pas oublier de poster les arguments
    		// ici, l'id de la TMA
    		sel = document.getElementById('tma');
    		idtma = sel.options[sel.selectedIndex].value;
    		xhr.send("idtma="+idtma);
    	}
    Voila maintenant mon code PHP de la première liste déroulante
    Code php :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    echo"<tr>
    			<td valign='top'>
    				<label>Nom de la TMA*</label>
    			</td>
    			<td><div onClick = 'sa();serv();' >
    				<select name     = 'tma' 
    						id       = 'tma' 
    						style    = 'width:313px;float:left;' 
    						REQUIRED>
     
    				<option value=''> </option>";
     
    				//Récupère la liste des tma
    				$liste_tma = mysql_query("SELECT * FROM tma")or die ('Erreur SQL !<br>'.$res.'<br>'.mysql_error());
    				while($row = mysql_fetch_assoc($liste_tma))
    				{										
    					echo "<option value='".$row["id_tma"]."'>".$row["libelle_tma"]." </option>";
    				}				
    echo"				</select> </div>
    			</td>
    		</tr>";

    Voila merci d'avance de votre aide

  2. #2
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro Andry Aimé
    Inscrit en
    septembre 2007
    Messages
    7 033
    Détails du profil
    Informations personnelles :
    Nom : Homme Andry Aimé
    Localisation : Ile Maurice

    Informations forums :
    Inscription : septembre 2007
    Messages : 7 033
    Points : 11 173
    Points
    11 173

    Par défaut

    Bonjour,

    C'est dans le onchange du select que tu devais appeler les fonctions mais pas dans le onclick du div.
    Montre nous le code HTML généré de la page (avec les div à mettre à jour aussi) mais pas le code PHP.

    A+.

  3. #3
    Membre régulier
    Femme Profil pro Justine
    Etudiante en informatique
    Inscrit en
    janvier 2013
    Messages
    97
    Détails du profil
    Informations personnelles :
    Nom : Femme Justine
    Localisation : France

    Informations professionnelles :
    Activité : Etudiante en informatique

    Informations forums :
    Inscription : janvier 2013
    Messages : 97
    Points : 73
    Points
    73

    Par défaut

    Bonjour,

    C'est dans le onchange du select que tu devais appeler les fonctions mais pas dans le onclick du div.
    oui c'est ce que j'avais fait avant, mais dans la discussion que j'ai mis en lien ils disent que de mettre l'enevement dans le div aurait été une solution. Donc j'ai changé. Mais qu'importe l'appel de fonction ça ne marche pas

    Et voila le code généré
    (PS : TMA représente la première liste, Application concernée représente la seconde liste)
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    function serv()
    {
    	var xhr = getXhr();
    	// On défini ce qu'on va faire quand on aura la réponse
    	xhr.onreadystatechange = function(){
    	// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    		if(xhr.readyState == 4 && xhr.status == 200){
    			leselect = xhr.responseText;
    			// On se sert de innerHTML pour rajouter les options a la liste
    			document.getElementById('service').innerHTML = leselect;
    		}
    	}
     
    	// Ici on va voir comment faire du post
    	xhr.open("POST","../Ajax/ajaxService.php",true);
    	// ne pas oublier ça pour le post
    	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    	// ne pas oublier de poster les arguments
            // ici, l'id de la TMA
    	sel = document.getElementById('tma');
    	idtma = sel.options[sel.selectedIndex].value;
    	xhr.send("idtma="+idtma);
    }
     
    function sa()
    {
             var xhr = getXhr();
    	 // On défini ce qu'on va faire quand on aura la réponse
    	xhr.onreadystatechange = function(){
    	// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    	if(xhr.readyState == 4 && xhr.status == 200){
    	       leselect = xhr.responseText;
    		// On se sert de innerHTML pour rajouter les options a la liste
    		document.getElementById('sous_appli').innerHTML = leselect;
    	}
    }
     
    	// Ici on va voir comment faire du post
    	xhr.open("POST","../Ajax/ajaxApplication.php",true);
    	// ne pas oublier ça pour le post
    	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    	// ne pas oublier de poster les arguments
    	// ici, l'id de la TMA
    	sel = document.getElementById('tma');
    	idtma = sel.options[sel.selectedIndex].value;
    	xhr.send("idtma="+idtma);
    }
     
     
    	function donnees(f)
    	{
    		//Fonction donnees() qui fonctionne également, dans un soucis de clarté je l'ai enlevé du code
    	}
    	</script>
    <tr>
    	<td valign='top'>
    		<label>Nom de la TMA*</label>
    	</td>
    	<td>
    		<select name     = 'tma' 
    		              id       = 'tma' 
    			     style    = 'width:313px;float:left;' 
    			     onClick = 'sa();serv();donnees(this.form);' REQUIRED>
     
    			<option value=''> </option>
                            <option value='1'>TMA Virement </option>
                            <option value='2'>TMA Prelevement </option>
                            <option value='3'>TMA PDE </option>
                            <option value='4'>TMA NOYEC </option>
                            <option value='5'>TMA Produit Packagé </option>
                            <option value='6'>TMA SAV Canaux </option>
                            <option value='7'>TMA Artemis </option>
                            <option value='8'>TMA CDC </option>
                            <option value='9'>TMA DOC </option>
                            <option value='10'>TMA TREF </option>				                       </select> 
    	</td>
    </tr>
    <tr>
    	<td>
    		<label>Application concernée* </label>
    	</td>
    	<td>
                    <select name     = 'sous_appli' 
    			      id       = 'sous_appli'
    			     style    = 'width:313px;' 
    			  onChange = 'donnees(this.form);'>
    		<option value=''>Choisir une TMA</option>
    		</select>
    	</td>
     </tr>

  4. #4
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro Andry Aimé
    Inscrit en
    septembre 2007
    Messages
    7 033
    Détails du profil
    Informations personnelles :
    Nom : Homme Andry Aimé
    Localisation : Ile Maurice

    Informations forums :
    Inscription : septembre 2007
    Messages : 7 033
    Points : 11 173
    Points
    11 173

    Par défaut

    Code :
    document.getElementById('sous_appli').innerHTML = leselect;
    Code html :
    1
    2
    3
    4
    <select name     = 'sous_appli' 
    			      id       = 'sous_appli'
    			     style    = 'width:313px;' 
    			  onChange = 'donnees(this.form);'>
    Un select ne suporte pas innerHTML sous IE. C'est le td conteneur que tu dois mettre à jour.

    A+.

  5. #5
    Membre régulier
    Femme Profil pro Justine
    Etudiante en informatique
    Inscrit en
    janvier 2013
    Messages
    97
    Détails du profil
    Informations personnelles :
    Nom : Femme Justine
    Localisation : France

    Informations professionnelles :
    Activité : Etudiante en informatique

    Informations forums :
    Inscription : janvier 2013
    Messages : 97
    Points : 73
    Points
    73

    Par défaut

    Ah merci beaucoup !
    Ça m'a permis de régler un autre petit soucis du coup
    Merci encore,
    Bonne journée !

+ Répondre à la discussion
Cette discussion est résolue.

Liens sociaux

Règles de messages

  • Vous ne pouvez pas créer de nouvelles discussions
  • Vous ne pouvez pas envoyer des réponses
  • Vous ne pouvez pas envoyer des pièces jointes
  • Vous ne pouvez pas modifier vos messages
  •