Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript > Bibliothèques & Frameworks
Bibliothèques & Frameworks Forum d'entraide sur les frameworks et bibliothèques JavaScript (jQuery, Mootools, Prototype, Script.aculo.us, etc.). Avant de poster : Cours Frameworks JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 24/06/2008, 16h22   #1
Membre du Club
 
Inscription : août 2005
Messages : 50
Détails du profil
Informations forums :
Inscription : août 2005
Messages : 50
Points : 55
Points : 55
Par défaut AJAX / mise à jour de div

Bonjour, j'ai un code pourtant pas si compliqué mais qui semble ne pas fonctionner : il s'agit d'un tableau HTML dont les lignes sont filtrées et réaffichées avec Ajax lorsque l'on saisit des caractères dans un input correspondant à la colonne à filtrer (Equivalent du WHERE champ like 'abc%' SQL).

Voici le contenu du fichier XML de réponse (fo_filtrer.php), qui me renvoie les résultats attendus :

Code :
1
2
3
4
5
6
7
8
 
Header("content-type: text/xml");
$newContent .= '<?xml version="1.0" encoding="UTF-8"?>';
$newContent .= '<ajax-response>';
$newContent .= '<response type="element" id="d2">';
$newContent .= utf8_encode(fo_creer_corps($sql)); 
$newContent .= '</response>';
$newContent .= '</ajax-response>';
Je vous passe les détails de la fonction fo_creer_corps() qui me sert à sortir le fichier final (fo_filtrer.php) 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
 
<?xml version="1.0" encoding="UTF-8"?>
    <ajax-response>
      <response type="element" id="d2">
        <tr id="tr_1" class="tr_paire">
          <td id="td_1_0">
            2185
          </td>
          <td id="td_1_1">
            test
          </td>
          <td id="td_1_2">
            2007-01-23
          </td>
          <td id="td_1_3">
            2007-01-25
          </td>
        </tr>
        <tr id="tr_2" class="tr_impaire">
          <td id="td_2_0">
            2186
          </td>
          <td id="td_2_1">
            test2
          </td>
          <td id="td_2_2">
            2002-01-16
          </td>
          <td id="td_2_3">
            2002-01-18
          </td>
        </tr>
      </response>
    </ajax-response>
Et voici le fichier index.php qui ne fonctionne pas :
(je précise que les alert(); placés dans le code pour vérification s'exécutent bien, la fonction javascript fo_filtrer est donc bien appelée)
Je place aussi la réponse dans le div d2 au lieu du div d1 pour mieux débugger et les détails de l'implémentation sont omis pour une meilleure visibilité.

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tableau AJAX</title>
<script src="rico2rc2/src/prototype.js" type="text/javascript"></script>
<script src="rico2rc2/src/rico.js" type="text/javascript"></script>
<script type="text/javascript">
function registerStuff()
{
    alert('ok1');
    ajaxEngine.registerRequest('fo_filtrer','http://localhost/AJAXX/fo_filtrer.php');
    ajaxEngine.registerAjaxElement('d2');
}
function fo_filtrer()
{
    alert('ok2');
    //Envoyer le formulaire form_filtre
    //document.form_filtre.action='fo_filtrer.php';
    //document.form_filtre.submit();
    ajaxEngine.sendRequest('fo_filtrer');
}
 
</script>
</head>
<body onLoad="registerStuff()">
<div id="d1">
  <table id="table1" cellspacing="0" border="1" width="800px">
    <thead>
      <tr id="tr_0">
        <th id="th_0" width="80px">ID</th>
        <th id="th_1" width="80px">TITRE</th>
        <th id="th_2" width="80px">DATE_DEBUT</th>
        <th id="th_3" width="80px">DATE_FIN</th>
      <tr id="tr_filtre">
        <form id="form_filtre" name="form_filtre">
          <td id="td_filtre0" name="td_filtre"><input id="input_filtre_value0" name="input_filtre_value0" type="text" onKeyUp="fo_filtrer()" />
            <input id="input_filtre_name0" name="input_filtre_name0" type="hidden" value="IDFI_MANIF" /></td>
          <td id="td_filtre1" name="td_filtre"><input id="input_filtre_value1" name="input_filtre_value1" type="text" onKeyUp="fo_filtrer()" />
            <input id="input_filtre_name1" name="input_filtre_name1" type="hidden" value="TITRE" /></td>
          <td id="td_filtre2" name="td_filtre"><input id="input_filtre_value2" name="input_filtre_value2" type="text" onKeyUp="fo_filtrer()" />
            <input id="input_filtre_name2" name="input_filtre_name2" type="hidden" value="DATE_DEBUT" /></td>
          <td id="td_filtre3" name="td_filtre"><input id="input_filtre_value3" name="input_filtre_value3" type="text" onKeyUp="fo_filtrer()" />
            <input id="input_filtre_name3" name="input_filtre_name3" type="hidden" value="DATE_FIN" /></td>
        </form>
      <tr>
    <thead>
    <tbody id="table_body">
    <span id="span_body">
    <tr id="tr_1" class="tr_paire">
      <td id="td_1_0">2185</td>
      <td id="td_1_1">test</td>
      <td id="td_1_2">2007-01-23</td>
      <td id="td_1_3">2007-01-25</td>
    </tr>
    <tr id="tr_2" class="tr_impaire">
      <td id="td_2_0">2150</td>
      <td id="td_2_1">test3</td>
      <td id="td_2_2">2002-01-16</td>
      <td id="td_2_3">2002-01-18</td>
    </tr>
    </span>
    </tbody>
    <div id="res"></div>
  </table>
</div>
<div id="d2"></div>
</body>
</html>
J'espère que quelqu'un saura m'aider.
Merci d'avançe.
bastiencb est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 24/06/2008, 18h09   #2
Responsable Modération
 
Homme
Inscription : janvier 2007
Messages : 9 316
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : France, Isère (Rhône Alpes)

Informations professionnelles :
Secteur : Finance

Informations forums :
Inscription : janvier 2007
Messages : 9 316
Points : 15 519
Points : 15 519
Bonjour,
il s'agit vraisemblablement du récurent problème de cache (sous IE).

Ajoute un timestamp (paramètre variable, ex : date en ms) à l'url appelée par Ajax, pour forcer la rafraîchissement du cache ...
Sinon, voir les entête PHP "no-cache".

Pour plus de précisions, une petite recherche s'impose

A+
E.Bzz est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 18h02.


 
 
 
 
Partenaires

Hébergement Web