Cases cochées : insertion en bdd via une popup

Version imprimable

Bonjour,

Je cherche à enregistrer en base de données (MySQL) une liste de programmes qu'on aurait coché : par exemple ici on enregistre MEGA et NH2008, mais pas AB-09 :
Code:

1 2 3 4 5 6 <input type="checkbox" name="prg[]" value="AB-09" checked="" /> AB-09 <br /> <input type="checkbox" name="prg[]" value="MEGA - level 1" checked="checked" > MEGA - level 1 <br /> <input type="checkbox" name="prg[]" value="NH2008 - level 1" checked="checked" > NH2008 - level 1 <br />
En sachant qu'il y a entre 150 et 300 programmes affichés dans la liste... C'est un tableau php qui génère les input selon l'utilisateur (on affiche simplement $Tab[1]; qui contient tout, après l'extraction bdd).

Je voudrais passer les programmes cochés dans une popup, qui se chargerait d'insérer la liste dans la bdd et renverrait simplement ok ou ko. Mais je sèche totalement... Quelle est selon vous la façon la plus simple d'y arriver ? J'avais commencé à passer le tableau en paramètre d'une fonction mais je n'y suis pas arrivé. En plus il faut déterminer quelles cases sont bien cochées : à quel moment doit-on le vérifier ? Dès l'ouverture de la popup, ou bien on passe tout d'un coup, et la popup trie avant l'insertion ?

Des suggestions ? Après plusieurs heures de tests et de recherche, mais ça ne convient pas à mon contexte de popup), je ne sais plus quoi essayer... Et quand je trouve des sujets ça parle d'Excel ou d'Access ! :aie: Donc désolé s'il existe déjà un sujet mais je n'ai rien trouvé, merci de me rediriger si c'est le cas !

Merci d'avance pour votre aide !

Bonsoir,
1. Pourquoi veux tu absolument utiliser une popup ?
2. Pour insérer les diverses valeurs de tes checkbox il faut effectivement utiliser foreach() :
Code:

1 2 3 4 5 6 7 8 9 <?php if (isset($_POST['prg'])) { $tab_programme = $_POST['prg']; foreach($tab_programme as $programme){ $insert_SQL = "INSERT INTO ma_table (programmes) VALUES ('$programme')"; .... } } ?>

07/11/2008, 22h54
Jarodd

Bonsoir et merci pour ton aide :)

1/ Directive du chef, tout l'intranet est fait sous cette forme donc on garde la même ligne
2/ je teste ça mercredi et je dirai si ça marche :)
07/11/2008, 23h05
Jumano

La popup doit seulement te dire que c'est OK ou elle a une autre utilité ?
12/11/2008, 09h17
Jarodd

Bonjour,

La popup doit aussi gérer l'insertion des programmes cochés dans la base. Une seconde popup qui aura la même forme devra permettre la modification des programmes sélectionnés.
12/11/2008, 11h12
Jarodd

Je fais un petit up sur le problème... Je n'arrive toujours pas à passer les valeurs, car il ya un souci dans le formulaire.

Voilà sa forme actuelle :
[Zone 1]
[Zone 2]
[Zone 3] [Boutons popup]
[Zone 4]

On déroule les zones selon l'arbo : le choix de la zone 1 influe sur la zone 2, qui influe sur la 3, etc. On reste donc dans la même page, sans indiquer d'attribut action à la balise form. Or dans ce cas, je ne peux pas faire passer les valeurs de zone 3 avec l'ouverture de la popup, puisque cela exige qu'il y ait un attribut action ! Et en mettre un foire l'affichage des zones précédentes...

Je ne vois pas comment faire, j'ai essayé avec du GET et du POST, et du javascript qui récupère les valeurs de la fenêtre appelante. Or cela prend les valeurs au moment du chargement de la page-mère, et pas les valeurs modifiées ! Aucun intérêt donc... Qui aurait un tuyau pour me débloquer ? :(
12/11/2008, 13h13
Jumano

Pourrais tu nous monter le code de tes différents formulaires ....

Je suis en train d'essayer d'enregistrer la liste des cases cochées dans une même page, sans passer par la popup, qui complique tout...

En attendant voilà le code, j'espère qu'il est complet parce qu'en plusieurs bouts ! (includes)

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
 
<script language="JavaScript" type="text/javascript">
	function BUCreateList() {
		window.open("./CreateList.php?", "CreateList", "scrollbars=yes, resizable=yes, width=600, height=500, left=400, top=150");
	}
</script>
 
[...]<form name="BUIndicator">
	<div align="left">
		<table width="800" height="100" border="0">
			<tr>
				<td width="400px">
					Choix 1
					<div align="center">
						Valeur1 : <input type="radio" name="choix1" value="var1" onClick="submit()" />
						&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
						Valeur2 : <input type="radio" name="choix1" value="var2" onClick="submit()" />
					</div>
				</td>
			</tr>
 
			<?php
 
			if( isset($_GET['choix1']) ) {
				$choix1 = $_GET['choix1'];
				$Valeurs = GetVar($choix1); // extraction Bdd des valeurs
 
				$SelectCode = '<select name="choix2" id="choix2" onChange="submit()">';
				$SelectCode = $SelectCode . '<option>-- Liste des valeurs : </option>';
				for( $i = 0; $i < count($Valeurs); $i++ ) {
					$TabValeurs[$i] = str_replace(" ", "%", $Valeurs[$i]);
					$SelectCode = $SelectCode . "<option selected value = " . $TabValeurs[$i] . ">" . $Valeurs[$i] . "</option>";
				}
				$SelectCode = $SelectCode . "</select>";
 
				?>
 
				<tr>
					<td border="1" width="400px">
						Liste des valeurs :
						<div align="center">
							<?php echo $SelectCode; ?>
						</div>
					</td>
				</tr>
 
				<?php
 
			}
 
			if( isset($_GET['Valeurs']) ) {
				$PrgListTab = GetPrg($_GET['Valeurs'], $BuSelected); // extraction des programmes
				$CodeHtml = GenerateHTML1($PrgListName, $Passage); // génération de la liste des programmes
 
				?>
 
				<tr>
					<td width="400px">
						Liste des programmes
						<div style="background-color : #FFFFE0; padding : 10px 2px; height:180px; overflow : auto;">
								<input type="hidden" id="CasesNb" value="<?php echo $CodeHtml[0]; // Nb de programmes?>" /> 
								<input type="hidden" id="CasesListe" value="<?php echo htmlentities($CodeHtml[1]); // Nom des programmes ?>" /> 
 
								<?php echo $CodeHtml[1]; // $Retour[1] de la fonction GenerateHTML1() ?>
							</div>
						</fieldset>
					</td>
					<td width="30px">
						&nbsp; <!-- espace -->
					</td>
					<td border="1" valign="top">
						<p>Veuillez cocher les programmes retenus puis :
							<input type="button" name="CreateList" value ="Créer une liste" onClick="CreateList();" />
						</p>
						<p>Ou :
							<br />
							<input type="button" name="ModifyList" value ="Modifier une liste" />
						</p>
					</td>
				</tr>
 
				<?php
 
			}
 
			?>
 
		</table>
	</div>
</form>

CrealteList.php :

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
 
<head>
<script language="JavaScript" type="text/javascript">
	function AffRef() {
		var CasesNb = window.opener.document.getElementById('CasesNb').value;
		var CasesListe = window.opener.document.getElementById('CasesListe').value;
 
	// Bloc Liste complète
		document.write("Liste complète (" + CasesNb + " cases) : <br /><br />");
		document.write("<div style=\"background-color : #FFFFE0; height:100px; overflow : auto;\">");
		document.write(CasesListe);
		document.write("</div>");
		document.write("<br />");
 
	// Bloc Liste des programmes sélectionnés
		document.write("Liste des programmes sélectionnés : <br />");
		document.write("<div style=\"background-color : #FFFFE0; height:180px; overflow : auto;\">");
		// on boucle sur toute la liste de programmes
		for ( cpt = 0; cpt < CasesNb; cpt++ ) {
		// pour chaque entrée, on vérifie sur la case est cochée ou pas - http://javascript.developpez.com/faq/?page=formChamps#valCheckbox
 
		// voir http://www.developpez.net/forums/d524921/webmasters-developpement-web/javascript/librairies-javascript-personnalisation-syntaxe/
			var explode = function(str, sep) { return str.split(sep); }
			var CasesListeTab = explode(CasesListe, '<br>'); // on sépare chaque ligne du tableau
			var pattern = 'checked="checked"';
 
			// TEST EC
			// on vérifie sur la chaine contient checked="checked"
			if( CasesListeTab[cpt].indexOf(pattern) != -1 ) { // retour = -1 quand pattern pas trouvé dans chaine
				document.write(cpt + " est coché<br />"); // != -1 : pattern trouvé
			} else {
				document.write(cpt + " n'est pas coché<br />");
			}
		}
		document.write("</div>");
		}
 
	</script>
</head>
<body>
	<script language="JavaScript" type="text/javascript">
		//AffRef();
	</script>
[...]

12/11/2008, 15h31
Jarodd

Citation:

Envoyé par Jarodd

Or cela prend les valeurs au moment du chargement de la page-mère, et pas les valeurs modifiées ! Aucun intérêt donc... Qui aurait un tuyau pour me débloquer ? :(

En fait tout mon problème vient de ce point !

Toutes les cases sont cochées par défaut (elles sont trop nombreuses pour que l'utilisateur les coche une par une). Donc même si on la décoche on envoie à la page de traitement checked="checked" !

Il me faudrait donc une solution pour que la valeur de la case envoyée soit cette qui existe à l'instant du clic, et pas du chargement initial ! J'espère que je suis clair, moi je finis par m'embrouiller à force... :aie: Mais je ne sais pas comment gérer cela...

Bonsoir,
Est-ce que ceci te conviendrait :
1 - Tu donnes un "ID" à ton formulaire le meêm que le nom.

Code:

<form name="BUIndicator" id="BUIndicator">

2 - Le code Javscript :

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
<script language="JavaScript" type="text/javascript">
	function AffRef() {
		var CasesNb = window.opener.document.getElementById('CasesNb').value;
		var CasesListe = window.opener.document.getElementById('CasesListe').value;
 
	// Bloc Liste complète
		document.write("Liste complète (" + CasesNb + " cases) : <br /><br />");
		document.write("<div style=\"background-color : #FFFFE0; height:100px; overflow : auto;\">");
		document.write(CasesListe);
		document.write("</div>");
		document.write("<br />");
 
	// Bloc Liste des programmes sélectionnés
		document.write("Liste des programmes sélectionnés : <br />");
		document.write("<div style=\"background-color : #FFFFE0; height:180px; overflow : auto;\">");
		var cases = window.opener.document.getElementById('BUIndicator').Prog; //Prog est le nom des checkbox (à modifier)
		for (i=0; i<cases.length; i++) {
    		if (cases[i].checked) {
      		document.write(cases[i].value + " est coché<br />");			} else {
			document.write(cases[i].value + " n'est pas coché<br />");
			}
		}
		document.write("</div>");
}
</script>

Pour l'exemple j'ai appelé les checkbox = Prog, à toi de modifier dans le script avec le nom de tes checkbox ...

Bonjour,

Merci pour ton aide Jumano :)

Code:

Pour l'exemple j'ai appelé les checkbox = Prog, à toi de modifier dans le script avec le nom de tes checkbox ...

Mes checkbox sont appelés "prg", pourtant en adaptant à ton cide cela ne fonctionne pas :
Code:

1 2 3 4 5 6 7 8 9 <form name="BUIndicator" id="BUIndicator"> ... <input name="prg[]" value="TAB0" checked="checked" type="checkbox">TAB0<br> <input name="prg[]" value="TAB1" type="checkbox">TAB1<br> <input name="prg[]" value="TAB2" checked="checked" type="checkbox">TAB2<br> <input name="prg[]" value="TAB3" checked="checked" type="checkbox">TAB3<br> <input name="prg[]" value="TAB4" checked="checked" type="checkbox">TAB4<br> ... </form>
Code:

1 2 3 4 5 6 7 8 var cases = window.opener.document.getElementById('BUIndicator').prg; for (i = 0; i < cases.length; i++) { if (cases[i].checked) { document.write(cases[i].value + " est coché<br />"); } else { document.write(cases[i].value + " n'est pas coché<br />"); } }
J'ai aussi essayé avec window.opener.document.getElementById('BUIndicator').prg[]; mais c'est pareil...

13/11/2008, 09h39
Jumano

Bonjour,
Essaye d'enlever les '[]' aux noms de tes checkbox ...
13/11/2008, 10h05
Jarodd

Ca marche ! Merci Jumano tu m'enlèves un belle poutre du pied ! :king:

Pour la syntaxe, j'avais pourtant lu qu'il fallait les crochets pour stocker les valeurs dans un tableau ! C'est difficile de s'y retrouver... :aie:

Re,
Il est vrai que la bonne syntaxe est d'ajouter des '[]' à tes noms de checkbox :
Donc tu peux modifier ton script comme ceci :

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
function AffRef() {
		var CasesNb = window.opener.document.getElementById('CasesNb').value;
		var CasesListe = window.opener.document.getElementById('CasesListe').value;
 
	// Bloc Liste complète
		document.write("Liste complète (" + CasesNb + " cases) : <br /><br />");
		document.write("<div style=\"background-color : #FFFFE0; height:100px; overflow : auto;\">");
		document.write(CasesListe);
		document.write("</div>");
		document.write("<br />");
 
	// Bloc Liste des programmes sélectionnés
		document.write("Liste des programmes sélectionnés : <br />");
		document.write("<div style=\"background-color : #FFFFE0; height:180px; overflow : auto;\">");
 
	  var cases = window.opener.BUIndicator.elements;
      var len = cases.length;
      var i=0;
      for( i=0; i<len; i++)
      if (cases[i].type=='checkbox')
      {
        if(cases[i].checked) {
    		document.write(cases[i].value + " est coché<br />"); // != -1 : pattern trouvé
			} else {
			document.write(cases[i].value + " n'est pas coché<br />");
			}
		}
		document.write("</div>");
}

Comme quoi çà m'arrive aussi de dire des conneries ....:aie:

Hum je dois louper quelque chose... J'ai bien ajouter les [] aux name des checkbox. Le script a changé depuis ce matin, je l'ai adapté à ma sauce ;)
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 var CasesListe = window.opener.BUIndicator.elements; var TabPrgCoches = new Array(); // tableau pour stocker les programmes cochés var nb = 0; // on compte le nombre de cases cochées dans le for() TabPrgCoches = ''; for (CasesCpt = 0; CasesCpt < CasesListe.length; CasesCpt++) { if (CasesListe[CasesCpt].checked) { // si la case est cochée if (nb >= 1) { // si on a déjà un enregistrement, on ajoute un séparateur TabPrgCoches = TabPrgCoches + ' ++ '; } TabPrgCoches = TabPrgCoches + CasesListe[CasesCpt].value; nb++; } else { // DEBUG //document.write(CasesListe[CasesCpt].value + " n'est pas coché<br />"); } }
TabPrgCoches ne renvoie plus rien avec la "nouvelle" méthode alors que j'avais la liste complète des programmes avec l'ancienne. Je ne vois pas à quel endroit je me loupe... :?

Re,
Tu as oublié d'indiquer le 'type' de l'élement, j'ai modifié comme ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var CasesListe = window.opener.BUIndicator.elements;
		var TabPrgCoches = new Array(); // tableau pour stocker les programmes cochés
		var nb = 0; // on compte le nombre de cases cochées dans le for()
		var CasesCpt=0;
		TabPrgCoches = '';
		for (CasesCpt = 0; CasesCpt < CasesListe.length; CasesCpt++) {
		if (CasesListe[CasesCpt].type=='checkbox')
      	{
		if (CasesListe[CasesCpt].checked) { // si la case est cochée
		if (nb >= 1) { // si on a déjà un enregistrement, on ajoute un séparateur
		TabPrgCoches = TabPrgCoches + ' ++ ';
		}
		TabPrgCoches = TabPrgCoches +' '+CasesListe[CasesCpt].value;
		nb++;
		}
		}
		}
		document.write(TabPrgCoches);

14/11/2008, 12h04
Jarodd

Je reviens à ce problème... Sale semaine pour ce code :roll:

J'ai testé ton dernier code en mettant des crochets à name="prg[]" mais cela ne marche pas. Est-ce que la syntaxe est correcte sans crochet ? Ca marche sans (ton premier code) donc je me demande si ça vaut le coup de vouloir améliorer à tout prix vu que je suis déjà à la bourre :( Mais s'il vaut mieux mettre des crochets alors il faut que j'y arrive...
14/11/2008, 12h58
Jumano

Essaye en modifiant cette ligne :

Code:

var CasesListe = window.opener.document.getElementsByTagName('input');