problème avec xmlhttprequest et firefox

problème avec xmlhttprequest et firefox - HTML/CSS - Programmation

Marsh Posté le 20-09-2010 à 15:33:37    

Bonjour, je viens exposer mon soucis ici ;)
 
tout d'abord, je travail sur un formulaire, un 2eme menu déroulant dépendant du 1er et un 3eme dépendant du 2sd, il fonctionne très bien, voir les pages ci-dessous, mais il ne fonctionne que sous IE8, pas sous FF 3.6.10 !
 
J'ai cherché sur le web et cela proviendrait de xmlhttprequest voir du bouton submit...
 
Je suis débutant en php/mysql et pas de notion en java, j'aimerais des conseils sur mon problème, voir une solution ;)
 
voici les pages dont vous auriez besoin :
 
ajax.js

Code :
  1. function ajax(strthis)
  2. {
  3. var param = strthis.value;
  4.                 var unite = document.getElementById("unite" ).options[document.getElementById("unite" ).selectedIndex].value;
  5. $("#tr_codedial" ).empty();
  6. $.ajax
  7. (
  8.  {
  9.   type: "POST",
  10.   url: "select_codedial.php",
  11.   data: "var="+param,
  12.   success:
  13.   function(msg)
  14.   {
  15.    $("#tr_codedial" ).append("<td><div align='right'>Code Dialogue :</div></td><td><div align='left'>"+ msg +"</div></td>" );
  16.   }
  17.  }
  18. );
  19. }
  21. function ajax2(strthis)
  22. {
  23. var param = strthis.value;
  24.                 var intitule = document.getElementById("intitule" ).options[document.getElementById("intitule" ).selectedIndex].value;
  25. $("#tr_intitule" ).empty();
  26. $.ajax
  27. (
  28.  {
  29.   type: "POST",
  30.   url: "select_intitule.php",
  31.   data: "var="+param,
  32.   success:
  33.   function(msg)
  34.   {
  35.    $("#tr_intitule" ).append("<td><div align='right'>Intitul&eacute; Code Dialogue :</div></td><td><div align='left'>"+ msg +"</div></td>" );
  36.   }
  37.  }
  38. );
  39. }


 
form1.php

Code :
  1. <script type="text/javascript" src="jquery.js"></script>
  2. <script type="text/javascript" src="ajax.js"></script>
  3. <form method="POST" action="valide1.php" name="caapp">
  4. <tr id='tr_affaire' align="center">
  5.        <td><div align="right">Service : </div></td>
  6.                           <td><div align="left"><?php include('select_unite.php')?></div></td>
  7.                         </tr>
  9.      <tr id='tr_codedial'>
  10.        <td><div align="right">Code Dialogue : </div></td>
  11.                           <td><div align="left" id='tr_codedial'><?php include('select_codedial.php')?></div></td>
  12.                         </tr>
  14.      <tr id='tr_intitule'>
  15.        <td><div align="right">Intitulé Code Dialogue : </div></td>
  16.                           <td><div align="left" id='tr_intitule'><?php include('select_intitule.php')?></div></td>
  17.                         </tr>
  18. <input type="submit" value="Envoyer" />
  19.                   </form>


 
select_unite.php

Code :
  1. <HEAD>
  2. <script type="text/javascript" src="jquery.js"></script>
  3. <script type="text/javascript" src="ajax.js"></script>
  4. </HEAD>
  6. <BODY>
  8. <select id='unite' name='unite' onChange="ajax(this)">
  9.   <option value='void_affaire'>-</option>
  10.   <?php
  11.     include("../connexion.php" );
  12.    
  13.    
  14.    
  15.     $query = "SELECT DISTINCT unite FROM codedial ORDER BY unite ASC";
  16.     $rq = mysql_query($query) or die(mysql_error());
  17.    
  18.     while ($row=mysql_fetch_array($rq, MYSQL_ASSOC))
  19.     {
  20.       $unite = $row["unite"];
  21.       echo "<option value='$unite'>$unite</option>";
  22.     }
  23.     mysql_close();
  24.   ?>
  25. </select>
  27. </BODY>


 
select_codedial.php

Code :
  1. <HEAD>
  2. <script type="text/javascript" src="jquery.js"></script>
  3. <script type="text/javascript" src="ajax.js"></script>
  4. </HEAD>
  6. <BODY>
  8. <select id='codedial' name='codedial' onChange="ajax2(this)">
  9.   <option value='void_localisation'>-</option>
  10.   <?php
  11.     include("../connexion.php" );
  12.    
  13.     $var=$_POST['var'];
  14.    
  15.     $query = "SELECT DISTINCT codedial FROM codedial WHERE unite='$var' ORDER BY codedial ASC";
  16.     $rq = mysql_query($query) or die(mysql_error());
  18.     while ($row=mysql_fetch_array($rq, MYSQL_ASSOC))
  19.     {
  20.       $codedial = $row["codedial"];
  21.       echo "<option value='$codedial'>$codedial</option>";
  22.     } 
  23.     mysql_close();
  24.   ?>
  25. </select>
  27. </BODY>


 
select_intitule.php

Code :
  1. <HEAD>
  2. <script type="text/javascript" src="jquery.js"></script>
  3. <script type="text/javascript" src="ajax.js"></script>
  4. </HEAD>
  6. <BODY>
  8. <select id='intitule' name='intitule'>
  9.   <option value='void_localisation'>-</option>
  10.   <?php
  11.     include("../connexion.php" );
  12.    
  13.     $var=$_POST['var'];
  14.    
  15.     $query = "SELECT DISTINCT intitule FROM codedial WHERE codedial='$var' ORDER BY intitule ASC";
  16.     $rq = mysql_query($query) or die(mysql_error());
  18.     while ($row=mysql_fetch_array($rq, MYSQL_ASSOC))
  19.     {
  20.       $intitule = $row["intitule"];
  21.       echo "<option value='$intitule'>$intitule</option>";
  22.     } 
  23.     mysql_close();
  24.   ?>
  25. </select>
  27. </BODY>


Message édité par athome le 20-09-2010 à 20:24:00
Reply

Marsh Posté le 20-09-2010 à 15:33:37   

Reply

Marsh Posté le 20-09-2010 à 19:29:37    

C'est pas du Java mais du javascript , merci de modifier la catégorie :o


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 21-09-2010 à 10:46:30    

Y'a-t-il une erreur dans la console javascript de firefox ?
Pour débugger du javascript sous firefox, je te conseille d'installer l'extension firebug. Tu pourras voir les erreurs dans le script, leur contexte, ...

Reply

Marsh Posté le 21-09-2010 à 14:33:46    

il m'indique simplement ces fichiers :

Code :
  1. http://localhost/test3/form/select_codedial.php?                          jquery.js (ligne 5252)


 
ce qui correspond à :
 

Code :
  1. try {
  2.   xhr.send(


 
je n'ai pas encore intégré cette fonction, je pense que cela vient de là, mais je m'y prend surement mal pour l'insérer et l'adapter à mon code
 
merci encore de votre aide


Message édité par athome le 21-09-2010 à 14:35:08
Reply

Marsh Posté le 21-09-2010 à 15:23:04    

et quel est le message de l'erreur ?
 
Par ailleurs dans ajax.js, strthis.value est une erreur, l'élément select n'a pas de value, ce sont les options.
tu peux remplacer par $(strthis).val()

Reply

Marsh Posté le 21-09-2010 à 15:36:11    

je n'ai pas de message d'erreur, j'ai simplement ces lignes qui apparaissent dans l'onglet console de firebug
la première apparait au choix du 1er menu déroulant et la 2eme ligne au 2eme menu déroulant
quand le clic sur envoyer (vers la base) toujours pas de message d'erreur !
 

Code :
  1. http://localhost/test3/form/select_codedial.php? 200 OK 26ms                          jquery.js (ligne 5252)
  2. http://localhost/test3/form/select_intitule.php? 200 OK 11ms                         jquery.js (ligne 5252)


 
j'ai aussi remplacé strthis.value par $(strthis).val()
 
cela ne change pas le bon fonctionnement du formulaire sous IE8
 
mais toujours ce probleme sous FF qui ne permet pas d'enregistrer les valeurs dans la base


Message édité par athome le 21-09-2010 à 15:40:16
Reply

Marsh Posté le 21-09-2010 à 16:19:47    

OK
Ces lignes dans firebug correspondent aux appels ajax qui se font bien.
Le code de retour 200 indique qu'il n'y a pas d'erreur HTTP, et l'indication jquery.js (ligne 5252) correspond à l'envoi de la requête AJAX (xhr.send())
 
Si tu cliques sur le + à gauche de la ligne de l'appel AJAX dans la console firebug, qu'y a-t-il dans l'onglet POST et dans l'onglet Réponse ?

Reply

Marsh Posté le 21-09-2010 à 16:32:58    

dans le premier POST il y a :

Code :
  1. <select id='codedial' name='codedial' onChange="ajax2(this)">
  2. <option value='-'>-</option>
  3. <option value='choix1'>choix1</option>
  4. <option value='choix2'>choix2</option>
  5. <option value='choix3'>choix3</option>
  6. <option value='choix4'>choix4</option>
  7. <option value='choix5'>choix5</option>
  8. <option value='choix6'>choix6</option></select>


 
dans le second POST il y a :

Code :
  1. <select id='intitule' name='intitule'>
  2.   <option value='-'>-</option>
  3.   <option value='choix1'>choix1</option></select>


 
dans le premier Réponse il y a :

Code :
  1. var titre1
  2. Source
  3. var=titre1


 
dans le second Réponse il y a :

Code :
  1. var choix1
  2. Source
  3. var=choix1

Reply

Marsh Posté le 21-09-2010 à 17:14:19    

Tu as inversé POST et Réponse.
 
Là on voit que tu postes bien les données que tu veux, et que tu récupères une réponse correcte.
 
Que se passe-t-il si tu exécutes, avec la console, $("#tr_intitule" ).append("<td>azerty</td>" );
 
Ensuite, en regardant ton code de plus près, je vois quelques trucs un peu moches :
- vire les balises head, body, script de tes scripts PHP appelés en ajax.
En gros, tu veux récupérer une balise <select>, donc vire le HTML autours de cette balise
- il n'y a pas de balise table autours de ta balise tr
- Dans le PHP, avant d'utiliser une variable POST ou GET dans une requête SQL, appelle la fonction mysql_escape_string, sinon n'importe qui peut supprimer ta base de données ...

Reply

Marsh Posté le 22-09-2010 à 11:05:25    

voici la réponse de la console :

Code :
  1. >>> $("#tr_intitule" ).append("<td>azerty</td>" );
  2. array: [tr#tr_intitule]


 
en fait j'avais déjà viré les balises head, body, script et HTML
des fichiers select_*.php ;)
 
voici à quoi il ressemble :
 
select_codedial.php

Code :
  1. <select id='codedial' name='codedial' onChange="ajax2(this)">
  2.   <option value='-'>-</option>
  3.   <?php
  4.     include("../connexion.php" );
  5.    
  6.     $var=$_POST['var'];
  7.    
  8.     $query = "SELECT DISTINCT codedial FROM codedial WHERE unite='$var' ORDER BY codedial ASC";
  9.     $rq = mysql_query($query) or die(mysql_error());
  11.     while ($row=mysql_fetch_array($rq, MYSQL_ASSOC))
  12.     {
  13.       $codedial = $row["codedial"];
  14.       echo "<option value='$codedial'>$codedial</option>";
  15.     } 
  16.     mysql_close();
  17.   ?>
  18. </select>


 
dans ma page de formulaire form1.php il y a en fait une balise mais je ne l'ai pas collé
ayant fait le tri sur page, voici la version complète :
 
form1.php

Code :
  1. <?php
  2. include("../connexion.php" );
  3. ?>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head>
  7. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  8. <title>form profil 1</title>
  9. <LINK REL="SHORTCUT ICON" HREF="../favicon.ico" />
  10. <link href="style2.css" rel="stylesheet" type="text/css" />
  11. <script type="text/javascript" src="jquery.js"></script>
  12. <script type="text/javascript" src="ajax.js"></script>
  13. <script language="javascript">
  14. function popupcentree(page,largeur,hauteur,options)
  15. {   
  16. var top=(screen.height-hauteur)/2;   
  17. var left=(screen.width-largeur)/2;   
  18. window.open(page,"","top="+top+",left="+left+",width="+largeur+",height="+hauteur+","+options);
  19. }
  20. </script>
  21. </head>
  22. <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  23. <center>
  24.   <br />
  25.   <table width="957" class="tab" cellpadding="0" cellspacing="0">
  26.   <td height="18" colspan="3" valign="top"><table border="0" align="center" cellpadding="2" cellspacing="2">
  27.        <br />
  28. <div align="center">
  29.                   Formulaire création entrée profil 1<br /><br />
  31.                     <a href="donnees.php">Retour</a><br />
  32. <br />
  34.                   </div>
  37.                       <form method="POST" action="valide1.php" name="caapp">
  38.                      
  40.      <tr id='tr_affaire' align="center">
  41.        <td><div align="right">Service : </div></td>
  42.                           <td><div align="left"><?php include('select_unite.php')?></div></td>
  43.                         </tr>
  45.      <tr id='tr_codedial'>
  46.        <td><div align="right">Code Dialogue : </div></td>
  47.                           <td><div align="left" id='tr_codedial'><?php include('select_codedial.php')?></div></td>
  48.                         </tr>
  50.      <tr id='tr_intitule'>
  51.        <td><div align="right">Intitulé Code Dialogue : </div></td>
  52.                           <td><div align="left" id='tr_intitule'><?php include('select_intitule.php')?></div></td>
  53.                         </tr>
  57.                   </form>
  58.                       </table>
  59.      <br />
  60.   </td>
  61.                     
  62.             </table>
  63. </center>
  64. </body>
  65. </html>


 
sinon pour mysql_escape_string, je vais me renseigner
 
encore merci pour ton aide

Reply

Marsh Posté le 22-09-2010 à 11:05:25   

Reply

Marsh Posté le 22-09-2010 à 11:33:21    

Quand tu exécutes le append via la console, vois-tu la cellule s'ajouter au tableau ?
Le site est-il en ligne quelque part, que je puisse regarder ce qui cloche ?
As-tu essayé de changer de version de jQuery ?

Reply

Marsh Posté le 22-09-2010 à 11:48:02    

Alors oui je vois bien 'azerty' s'afficher dans le formulaire, pas dans la case mais bien en face de l'intitulé, après validation cette valeur n'est pas enregistré dans la base.
 
non, le site n'est pas en ligne, c'est du local pour de l'intranet
 
et non je n'ai pas changé de version de jquery, c'est la dernière que j'ai dl la semaine dernière (http://code.jquery.com/jquery-1.4.2.js)
 
cela ne pourrait pas venir, du fait que je n'ai pas de fonction XMLHttpRequest ?


Message édité par athome le 22-09-2010 à 11:57:16
Reply

Marsh Posté le 27-09-2010 à 10:05:26    

problème résolu, code ici :
 
http://cjoint.com/data/jxi3behaSE_test6_good.rar

Reply

Marsh Posté le 08-05-2012 à 00:57:42    

j'ai trouver cette article
 
http://astuces-news.blogspot.com/2 [...] quest.html
 
@+

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed