Récupération value d'une boîte à liste

**almoha** · 23/01/2011, 21h59

Bonsoir,

J'utilise un script JavaScript ayant pour effet d'ajouter une boîte à liste permettant de faire un sélection dans une autre boîte
Mon code HTML/PHP :

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
<form method ="post" action ="essai INSERT INTO.php">
<TABLE>
<TR>
<TD>
<SELECT NAME="SelectList" ID="SelectList" SIZE="5">
<option value=''>Aucun</option>
<?php
 
$res = mysql_query("SELECT LIB.NOM_LIBRAIRIE AS librairie,LIB.ID_LIBRAIRIE AS id_librairie
 
FROM LIBRAIRIE LIB
 

ORDER BY LIB.NOM_LIBRAIRIE");	
 
while($row = mysql_fetch_assoc($res)){
 
 
echo "<option value='".$row["id_librairie"]."'>".$row["librairie"]."</option>";
 
 }?>
 
 </select>	
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="->" ONCLICK="addIt();"></INPUT>
<BR>
<INPUT TYPE="BUTTON" VALUE="<-" ONCLICK="delIt();"></INPUT>
</TD>
<TD>
<SELECT NAME="PickList" ID="PickList" SIZE="5">
 
</SELECT>
</TD>
</TR>
</TABLE>

Le script fonctionne mais j'éprouve des difficultés dans la récupération du $_POST. En vue de l'insertion dans une base de données, je souhaite récupérer les values du

Code sql :

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

 <SELECT NAME="PickList" ID="PickList" SIZE="5">

(boîte à liste de droite ). J'ai pensé à faire du NAME un tableau :

Code :

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

1
2
NAME="PickList []"
$PickList_insert= (isset($_POST["PickList"]))? ($_POST["PickList"]):array();

Je bute ensuite...d'ailleurs je ne sais pas si je suis sur la bonne voie. Pouvez-vous m'aider à obtenir l'effet recherché ? Merci.

**MaitrePylos** · 24/01/2011, 08h19

ce que tu veux faire s'écrit comme ceci

Code :

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

1
2
(isset($_POST["PickList"]))?$PickList_insert = $_POST["PickList"]:
$PickList_insert = array();

sinon le plus simple

Code :

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

1
2
3
 
 
$PickList_insert = $_POST["PickList"];

**almoha** · 24/01/2011, 18h29

Merci pour ta réponse mais je n'arrive pas à mes fins. Je n'arrive pas récupérer les values du $_POST["PickList"]. Mon code 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
 
 
 
<form method ="post" action ="essai INSERT INTO.php">
<TABLE>
<TR>
<TD>
<SELECT NAME="SelectList" ID="SelectList" SIZE="5">// 1ere liste déroulante qui liste tous les genres
 
 
<?php 
 $requete_genres = "SELECT G.ID_GENRE,G.NOM_GENRE
 FROM GENRE G
 ORDER BY G.NOM_GENRE ASC
 ";
 
 $resultat_genres = mysql_query($requete_genres) or die('Erreur SQL !'.$requete_genres.'<br>'.mysql_error());
 
 
	while($data_genres = mysql_fetch_assoc($resultat_genres))
 
 
		{
 
 
 
echo '<option value="'.$data_genres['ID_GENRE'].'"'.(isset($_POST['SelectList']) && $_POST['SelectList'] == $row['SelectList'] ? ' selected="selected"' : '').'>'.$data_genres['NOM_GENRE'].'</option>';
//affichage dynamique de la liste des genres : opérationnel
 
}
 
?>	
 
 </select>	
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="->" ONCLICK="addIt();"></INPUT>
<BR>
<INPUT TYPE="BUTTON" VALUE="<-" ONCLICK="delIt();"></INPUT>
</TD>
<TD>
<SELECT NAME="PickList[]" ID="PickList" SIZE="5"> 
// 2nd liste déroulante (vierge au départ) qui se remplit en fonction des sélections faites dans la 1ere liste. Assimilable à une liste déroulante à  sélection multiple ? Je liste des livres qui peuvent avoir plusieurs genres (donc plusieurs values à ajouter en même temps).
 
</SELECT>
</TD>
</TR>
</TABLE>
 
 
$numero_insere = mysql_insert_id();// récupération de l'id_livre
 
(isset($_POST["PickList"]))?$PickList_insert = $_POST["PickList"]:
$PickList_insert = array(); 
 
foreach($PickList_insert as $genres) {
 
$sql = 'INSERT INTO `thematise` (`id_genre`, `id_livre`) VALUES("'. mysql_real_escape_string(trim($genres)).'","'. mysql_real_escape_string(trim($numero_insere)).'" )'; 
mysql_query ($sql) or die ('Erreur SQL !'.$sql.'<br />'.mysql_error());  }

L'insertion ne se fait pas dans la table thematise : id_genre et id_livre (récupéré grâce à $numero_insere) ne sont pas ajoutés...
J'espère avoir bien décrit ma problématique. Pouvez-vous m'apporter une aide complémentaire ? Merci.

**MaitrePylos** · 24/01/2011, 20h00

on commence donc par le début, un fichier ne prend ni espace ni accent.

donc ici déjà il y une erreur

Code :

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

1
2
 
<form method ="post" action ="essai INSERT INTO.php">

**almoha** · 24/01/2011, 20h55

Au temps pour moi... Mais même après avoir enlevé les espaces dans le nom du fichier, cela ne résout pas mon problème

Vois-tu d'autres anomalies dans mon code ? Merci encore.

**sabotage** · 25/01/2011, 07h42

il n'y a pas de fin de formulaire ni de bouton submit ?

**almoha** · 25/01/2011, 07h50

Si si : la fin du form et le bouton submit se trouvent plus loin dans mon code (j'ai d'autres champs de formulaire dans mon code qui ne concernent pas les boîtes à liste).

**MaitrePylos** · 26/01/2011, 08h56

Que donne

Code :

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

var_dump($_POST["PickList"]);

?

**almoha** · 26/01/2011, 13h22

Bonjour,

Code :

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

1
2
3
(isset($_POST["PickList"]))?$PickList_insert = $_POST["PickList"]:
$PickList_insert = array();
var_dump($_POST["PickList"]);

var_dump($_POST["PickList"]); me renvoie NULL après la soumission du formulaire. Si je fais :

Code :

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

var_dump ($PickList_insert );

il m'est renvoyé : array(0). Voyez-vous une explication ? Cela peut-il venir du script javascript ? Je précise pourtant que le système de la double liste fonctionne, ce n'est que la récupération des values qui ne marche pas. Merci de votre aide.

**MaitrePylos** · 26/01/2011, 13h28

Ok, quand ton deuxième select est généré, peux-tu faire un view source du code html de ta page (sous FF c'est ctrl + u), et nous montrer le code généré

**almoha** · 26/01/2011, 21h43

Exemple pour :

SELECT1
item1
Item2
Item3

SELECT2 (alimenté par les sélections du SELECT1 )
item4
Item5

Voici le code généré suite à l'affichage du 2nd select :

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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
 
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 
<title>INSERT INTO</title>
 
 
 
<!--SELECT MULTIPLE-->
 
<SCRIPT language="javascript" title="G1SCRIPT">
//Script Généré sur le Site <a href="http://www.G1SCRIPT.COM" target="_blank">http://www.G1SCRIPT.COM</a>
// Original:  Sean Geraty (sean_geraty@hotmail.com)
// Control flags for list selection and sort sequence
// Sequence is on option value (first 2 chars - can be stripped off in form processing)
// It is assumed that the select list is in sort sequence initially
var singleSelect = true;  // Allows an item to be selected once only
var sortSelect = true;  // Only effective if above flag set to true
var sortPick = true;  // Will order the picklist in sort sequence
// Initialise - invoked on load
function initIt() {
  var selectList = document.getElementById("SelectList");
  var pickList = document.getElementById("PickList");
  var pickOptions = pickList.options;
  pickOptions[0] = null;  // Remove initial entry from picklist (was only used to set default width)
  selectList.focus();  // Set focus on the selectlist
}
// Adds a selected item into the picklist
function addIt() {
  var selectList = document.getElementById("SelectList");
  var selectIndex = selectList.selectedIndex;
  var selectOptions = selectList.options;
  var pickList = document.getElementById("PickList");
  var pickOptions = pickList.options;
  var pickOLength = pickOptions.length;
  // An item must be selected
  if (selectIndex > -1) {
    pickOptions[pickOLength] = new Option(selectList[selectIndex].text);
    pickOptions[pickOLength].value = selectList[selectIndex].value;
    // If single selection, remove the item from the select list
    if (singleSelect) {
      selectOptions[selectIndex] = null;
    }
    if (sortPick) {
      var tempText;
      var tempValue;
      // Sort the pick list
      while (pickOLength > 0 && pickOptions[pickOLength].value < pickOptions[pickOLength-1].value) {
        tempText = pickOptions[pickOLength-1].text;
        tempValue = pickOptions[pickOLength-1].value;
        pickOptions[pickOLength-1].text = pickOptions[pickOLength].text;
        pickOptions[pickOLength-1].value = pickOptions[pickOLength].value;
        pickOptions[pickOLength].text = tempText;
        pickOptions[pickOLength].value = tempValue;
        pickOLength = pickOLength - 1;
      }
    }
  }
}
// Deletes an item from the picklist
function delIt() {
  var selectList = document.getElementById("SelectList");
  var selectOptions = selectList.options;
  var selectOLength = selectOptions.length;
  var pickList = document.getElementById("PickList");
  var pickIndex = pickList.selectedIndex;
  var pickOptions = pickList.options;
  if (pickIndex > -1) {
    // If single selection, replace the item in the select list
    if (singleSelect) {
      selectOptions[selectOLength] = new Option(pickList[pickIndex].text);
      selectOptions[selectOLength].value = pickList[pickIndex].value;
    }
    pickOptions[pickIndex] = null;
    if (singleSelect && sortSelect) {
      var tempText;
      var tempValue;
      // Re-sort the select list
      while (selectOLength > 0 && selectOptions[selectOLength].value < selectOptions[selectOLength-1].value) {
        tempText = selectOptions[selectOLength-1].text;
        tempValue = selectOptions[selectOLength-1].value;
        selectOptions[selectOLength-1].text = selectOptions[selectOLength].text;
        selectOptions[selectOLength-1].value = selectOptions[selectOLength].value;
        selectOptions[selectOLength].text = tempText;
        selectOptions[selectOLength].value = tempValue;
        selectOLength = selectOLength - 1;
      }
    }
  }
}
 
 
//Identifiant du script: V7-246/Form
//Mis en ligne: 08/10/03
//By TANGUY
</SCRIPT>
 
 
<!--SELECT MULTIPLE-->
 
 
</head>
 
 
<body>
 
 
<form method ="post" action ="essaiINSERT2.php">
<TABLE>
<TR>
<TD>
<SELECT NAME="SelectList" ID="SelectList" SIZE="5"><!--1ere liste déroulante qui liste dynamiquement tous les genres-->
 
 
 
<option value="32">Item1</option><option value="20">Item2</option><option value="13">Item3</option>
 
 </select>	
 
</TD>
<TD>
<INPUT TYPE="BUTTON" VALUE="->" ONCLICK="addIt();"></INPUT>
<BR>
<INPUT TYPE="BUTTON" VALUE="<-" ONCLICK="delIt();"></INPUT>
</TD>
<TD>
<SELECT NAME="PickList[]" ID="PickList" SIZE="5"> 
 
<!--pas <option value> généré...-->
 
</SELECT>
<input type="submit" class="checkbox_float" name="btSubmit2"/>
</TD>
</TR>
</TABLE>
 </form>
 
NULL 
 
}
 
</body>
</html>

Ce code est généré si l'Item4 ou l'Item5 n'est pas sélectionné (en surbrillance), ce qui est le comportement par défaut des Items rapatriés dans le SELECT2. Si je mets en surbrillance un des Items du SELECT2 (par ex l'Item1), le code généré est le même mais cette fois-ci le var_dump donne le résultat suivant :

Code :

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

array(1) { [0]=> string(2) "32" }

Du coup la requête d'insertion s'effectue mais se limite à l'insertion d'une seule value, celle que j'ai précédemment sélectionnée.

Or ce que je souhaiterais obtenir : après soumission, récupérer les valeurs des Items4 et 5 du SELECT2 par le simple fait de les avoir rapatriés précédemment dans le SELECT2. Voyez-vous comment y parvenir ? Merci encore de votre intérêt pour mon post.

EDIT : en inspectant avec firebug l'Item1 du SELECT2, je vois :

Code :

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

1
2
3
<select size="5"  id="PickList" name="PickList[]"> 
 
<option value="32">Item1</option></select>

Le code source de la page ne fait pas apparaitre cette option value...

**almoha** · 27/01/2011, 21h42

Bonsoir,

En faisant des tests supplémentaires, je me suis rendu compte qu'en rajoutant au SELECT2 l'attribut "multiple" :

Code :

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

<SELECT NAME="PickList[]" ID="PickList" multiple ="multiple" SIZE="5">

et en mettant en surbrillance l'item 4 et l'item 5, le var_dump donne le résultat suivant :

Code :

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

array(2) { [0]=> string(2) "32" [1]=> string(2) "20" }

La récupération simultanée de plusieurs values est donc désormais possible (ma requête d'insertion fonctionne donc désormais).
Mais je ne trouve pas très ergonomique de devoir sélectionner les items déjà rapatriés dans le SELECT2 avant de soumettre le formulaire et récupérer ainsi les values. Existe-t-il un moyen de contourner cette situation ? Peut-on récupérer les values sans avoir à sélectionner les items du SELECT2 ? Par le biais du PHP ou en modifiant le code JavaScript ? Merci d'avance de vos avis sur la question.

Récupération value d'une boîte à liste

Langage PHP

Discussions similaires

Partager

Partager