utilisation de checkbox avec prototype.js

newnet82 · 15/01/2011, 09h19

Bonjour,

J'utilise prototype.js pour faire de l'autocompletion. Je suis sous linux - php -

Dans ma page client.php j'ai :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<?php
   if (isset($_POST['client']))
   {
      $liste_client = extract_clients($_POST['id_etablissement'],  $_POST['client']);
 
      $i = 0;
      echo '<UL CLASS="clients">';
 
      while ($liste_client[$i])
      {
         echo "<LI CLASS='client'><SPAN CLASS='informal' STYLE='display: none;'>
" . $liste_client[$i] . "</SPAN><DIV CLASS='nom'>" . $liste_client[$i] . "</DIV>
</LI>";
 
         if (++$i == 10)
         {
            die('<LI>...</LI></UL>');
         }
      }
      echo '</UL>';
      die();
   }
 
   echo "<FORM ID='formulaire_situation' NAME='formulaire_situation' METHOD=post
 ACTION='?' onSubmit='return false;'>";
 
   echo "<INPUT TYPE='INPUT' NAME='client' id='client' VALUE='' SIZE=10>";
   echo "<DIV CLASS='update' ID='client_update'></DIV>";
   echo "<INPUT TYPE='hidden' NAME='client_id' id='client_id' VALUE=''>";
 
   $i = 1;
   foreach ($liste_etablissement as $key => $etabSQL)
   {
       echo "<INPUT TYPE='checkbox' NAME='id_etablissement" . "' ID='id_etablissement_" . $i . "' VALUE='" . $key . "'>" . $etabSQL . "<BR>";
      $i++;
   }
 
   // Autocompletion
   echo "<SCRIPT TYPE='text/javascript'>
      traitement_autocompletion_2();
      </SCRIPT>";

ma fonction traitement_autocompletion_2() est :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function traitement_autocompletion_2()
{
   new Ajax.Autocompleter(
      'client',
      'client_update',
      'client.php',
 
      {
         method: 'post',
         paramName: 'client',
         parameters: 'id_etablissement=' + document.getElementsByName('id_etablissement').item(0).checked? document.getElementsByName('id_etablissement').item(0).value:"",
         afterUpdateElement: ac_return
      }
   );
}

Je n'arrive pas à faire en sorte de passer les valeurs des checkbox à la partie traitement. Dans traitement_autocompletion_2 j'ai essayé plusieurs parametres mais aucun ne me fait passer ce que je veux (à savoir les valuers des checkbox)

Pourriez-vous m'aider ?

Merci

Bovino · 16/01/2011, 13h55

Tout d'abord, JavaScript s'exécutant coté client et s'appuyant sur la structure HTML, merci de poster le code HTML généré et pas le PHP.

Sinon :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

parameters: 'id_etablissement=' + $F('id_etablissement')

newnet82 · 23/03/2011, 08h19

Désolé pour le délai, je n'étais pas dispo avant.

Le HTML généré est le suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml" lang="fr">
 
<head>
      <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
 
      <title>TITRE</title>
      <link href="page_fichiers/menu_deroulant.css" rel="stylesheet" type="text/css">
      <link href="page_fichiers/select_deroulant.css" rel="stylesheet" type="text/css">
      <link href="page_fichiers/jquery.css" rel="stylesheet" type="text/css">
      <link href="page_fichiers/autocompletion.css" rel="stylesheet" type="text/css">
 
<!--
-------------------------------
PB de conflit
Resolu en modifiant Treeview.js.
Mis : (function($){  au debut
})(jQuery);          a la fin
 
-------------------------------
-->
 
      <script type="text/javascript" src="page_fichiers/jquery.js"></script>
      <script type="text/javascript" src="page_fichiers/prototype.js"></script>
 
      <script type="text/javascript" src="page_fichiers/scriptaculous.js"></script>
      <script type="text/javascript" src="page_fichiers/builder.js"></script>
      <script type="text/javascript" src="page_fichiers/effects.js"></script>
      <script type="text/javascript" src="page_fichiers/dragdrop.js"></script>
      <script type="text/javascript" src="page_fichiers/controls.js"></script>
      <script type="text/javascript" src="page_fichiers/slider.js"></script>
      <script type="text/javascript" src="page_fichiers/autocompletion.js"></script>
 
      <script type="text/javascript" src="page_fichiers/pop-up.js"></script>
      <script type="text/javascript" src="page_fichiers/menu.js"></script>
 
      <script type="text/javascript" src="page_fichiers/situ_client.js"></script>
      <script type="text/javascript" src="page_fichiers/fact_ligne.js"></script>
 
      <script type="text/javascript" src="page_fichiers/ajax.js"></script>
      <script type="text/javascript" src="page_fichiers/jquery_002.js"></script>
      <script type="text/javascript" src="page_fichiers/Treeview.js"></script>
      <script type="text/javascript" src="page_fichiers/ajax_ligne_fact.js"></script>
      <script type="text/javascript" src="page_fichiers/ajax_client_fact.js"></script>
   </head>
 
   <body>
      <div>
      <ul id="menu">
         <li>
            <a href="#">Clients</a>
            <ul>
               <li>
                  <a href="http://192.168.1.20/index.php?page=situ_cli">Situation compte</a>
               </li>
            </ul>
         </li>
      </ul>
      </div>
      <div>
         <form id="formulaire_situation" name="formulaire_situation" method="post" action="?" onsubmit="return false;">
            <table>
               <tbody>
                  <tr>
                     <td id="id_align_right2" colspan="3">
                        Recherche
                        <br>
                        <br>
                     </td>
                  </tr>
                  <tr>
                     <td id="id_unite">
                        Nom, Prénom
                     </td>
                     <td id="id_unite">
                        <input name="client" id="client" size="10" type="INPUT">
                        <div class="update" id="client_update"></div>
                        <input name="client_id" id="client_id" value="" type="hidden">
                     </td>
                     <td id="id_unite">
                        <input name="prenom" size="10" id="id_unite" type="text">
                     </td>
                  </tr>
                  <tr>
                     <td id="id_unite">
                        Etablissement
                     </td>
                     <td id="id_unite" colspan="2">
                        <input name="id_etablissement" value="Etablissement1" type="checkbox">
                           Etablissement1
                           <br>
                        <input name="id_etablissement" value="Etablissement2" type="checkbox">
                           Etablissement2
                           <br>
                        <input name="id_etablissement" value="Etablissement3" type="checkbox">
                           Etablissement3
                           <br>
                        <input name="id_etablissement" value="Etablissement3" type="hidden">
                     </td>
                  </tr>
                  <tr>
                     <td id="id_unite">
                        <input type="submit">
                     </td>
                  </tr>
               </tbody>
            </table>
         </form>
         <script type="text/javascript">
            traitement_autocompletion_2();
         </script>
      </div>
   </body>
</html>

Merci

newnet82 · 23/03/2011, 08h22

J'ai oublié de préciser que le $F('id_etablissement') me génére une erreur dans prototype.js en ligne 1280 :

"element is null"

Bovino · 23/03/2011, 08h29

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input name="id_etablissement" value="Etablissement1" type="checkbox">

Il ne faut pas confondre name et id !

Prototype récupère les éléments avec leur id.

16/01/2011, 13h55	#2
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 802 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 802 Points : 35 807 Points : 35 807	Tout d'abord, JavaScript s'exécutant coté client et s'appuyant sur la structure HTML, merci de poster le code HTML généré et pas le PHP. Sinon : Code : Sélectionner tout - Visualiser dans une fenêtre à part parameters: 'id_etablissement=' + $F('id_etablissement') __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

23/03/2011, 08h29	#5
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 802 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 802 Points : 35 807 Points : 35 807	Code : Sélectionner tout - Visualiser dans une fenêtre à part <input name="id_etablissement" value="Etablissement1" type="checkbox"> Il ne faut pas confondre name et id ! Prototype récupère les éléments avec leur id. __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

23/03/2011, 08h22	#4
newnet82 Invité de passage Bruno Inscription : janvier 2011 Messages : 3 Détails du profil Informations personnelles : Nom : Bruno Informations forums : Inscription : janvier 2011 Messages : 3 Points : 0 Points : 0	J'ai oublié de préciser que le $F('id_etablissement') me génére une erreur dans prototype.js en ligne 1280 : "element is null"
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email