Discussion :

[ririch]

Bonjour à tous,

j'ai un formulaire avec des lignes d'une bd qui s'affiche selon un premier paramètre choisie.
En face de chacune de mes lignes, j'ai une checkbox.
Des qu'au moins une checkbox est coché alors j'ai un bouton supprimer qu'y apparait.
Je veux que , lorsque je clique sur le bouton "supprimer", les lignes qui correspondent aux checkboxs cochées soient supprimer.

Voici mon formulaire :

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
<form name="affichage" method="post" action="">
	<table width="100%" border="1" cellspacing="0">
		<tr> 
			<td height="10"><div align="center" style="font-weight: bold">Date</div></td>
			<td height="10"><div align="center" style="font-weight: bold">Km</div></td>
			<td height="10"><div align="center" style="font-weight: bold">Evenement</div></td>
			<td height="10"><div align="center" style="font-weight: bold">Prestataire</div></td> 
			<td height="10"><div align="center" style="font-weight: bold">Cout €</div></td>
			<td height="10"><div align="center" style="font-weight: bold">Nombre de minutes</div></td>
			<td height="10"><div align="center" style="font-weight: bold">Commentaire</div></td>
			<td height="10"><div align="center" style="font-weight: bold">Supp</div></td>
		</tr>
 
 <%
	if  not IsEmpty(num_materiel) then							
	requete = "select *  from parc_gestion_vehicule "
	requete = requete & " inner join parc_prestataire on prestataire = idprestataire "
	requete = requete & " inner join parc_evenement on evenement = idevenement and num_materiel = "&num_materiel&"  "
	requete = requete & " order by date desc "
 
Set rs3 = Db_sql.Execute(requete)
	while not rs3.eof
 
	Response.write("<tr>")
	Response.write("<td><div align="center">"&rs3("date")&"</div></td>")
	Response.write("<td><div align="center">"&rs3("km")&"</div></td>")
	Response.write("<td><div align="center">"&rs3("Libelle")&"</div></td>")
	Response.write("<td><div align="center">"&rs3("libellé")&"</div></td>")
	Response.write("<td><div align="center">"&rs3("montant")&"</div></td>")
	Response.write("<td><div align="center">"&rs3("nb_heure")&"</div></td>")
	Response.write("<td><div align="center">"&rs3("commentaire")&"</div></td>")
			%>
	<td align="center" >
	<input id="supp<% =i %>" type="checkbox" name="supp<% =i %>" onclick="test_chckbx();">
	<input type="hidden" name="num_materiel<% = i %>" value="num_materiel<% = i %>" />
	<input type="hidden" name="dat<% = i %>" value="dat<% = i %>" />
	<input type="hidden" name="km<% = i %>" value="km<% = i %>" />
	<input type="hidden" name="evenement<% = i %>" value="evenement<% = i %>" />										
	</td>
					<%
								i=i+1							
	Response.write("</tr>")
	rs3.movenext 	
	wend
	end if
					%>
			<tr>		
				  <td></td><td></td><td></td><td></td><td></td><td></td><td></td>
				  <td align="center">
					<input id="validation" name="validation" type="submit" value="Valider" style="visibility:hidden;">
				  </td>
			</tr>
	 </table>
	  </form>

j'ai mis des champs cachés pour récupéré les valeurs de ma clef primaire qui seront cochés...

Maintenant Voici la requête de suppression :

Code :

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

1
2
3
4
5
6
7
8
9
10
 
'For each del.checkbox, si elle est cochée alors ...
		'if affichage.checked then
		del = "delete from parc_gestion_vehicule where num_materiel = num_materiel<% =i %> "
	 	del = del & " and dat = dat <% =i %> "
		del = del & " and km = km  <% =i %> "
		del = del & " and evenement = evenement <% =i %>"
		db.execute(del) 
		i=i+1
		'end if

Et c'est la ou j'ai le problème ...
Merci de me lancer sur une piste.
Je ne sais pas si je dois faire ca en javascript ou en asp ...
j'ai une idée pour le javascript mais ... :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
function test_supp() {
	var chkbx = document.forms['affichage'].getElementsByTagName("input");
	for (var i=0; i<chkbx.length; i++)  // Parcours les input du form
	  if (chkbx[i].type=="checkbox")   // Ne traite que les checkbox
		 if (chkbx[i].checked)  {// Si une cochée
			  // je la supprime apres avoir appuyé sur le bouton
			  			return true;    // Fin de la fonction
		  }
		document.getElementById('validation').style.visibility = "hidden";   // Si aucune trouvée => masque le bouton
 
}

le souci c'est que a

// je la supprime apres avoir appuyé sur le bouton

, je dois bien mettre ma requete.. et donc je mélanges asp(coté serveur) et javascript(coté client)...
Help
merci

[emmanuel.remy]

Salut,

Une chose est sûre: tu as effectivement le code côté client pour l'affichage et le code côté server pour la suppression dans ta base.

Tu disposes de 2 solutions au moment du clic sur le bouton "supprimer":

1. Tu postes les données avec un formulaire (ou un lien) vers le server. Tu fais ta suppression en base et tu affiches de nouveau ta page qui présentera de fait une ligne en moins.
2. Tu appelles via AJAX ta page ASP sur le server (équivaut à un post en "tâche de fond", sans recharger ta page) qui effectue la suppression en base. Côté client, au retour de l'appel AJAX, tu supprimes la ligne de ton tableau.

ERE

[ririch]

J'opte pour la premiere solution ...
Mais si je fais ca l'utilisateur ne pourra les supprimer que une a une, puisqu'il y a un rechargement de la page a chaque clique sur "supprimer" ...
Si c'est ca, j'abandonne mon idée de checkbox, qui était la pour permettre la suppression de plusieurs lignes

[andry.aime]

Salut,

Tu postes les données

Ceux sont les checkbox que tu postes, ainsi tu peux supprimer plusieurs enregistrements à la fois.
Les valeurs des checkbox doivent contenir l'id des enregistrements à supprimer.

[ririch]

le formulaire est la et existe bien :

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
<form name="affichage" method="post" action="">
	<table width="100%" border="1" cellspacing="0">
		<tr> 
		<td height="10"><div align="center" style="font-weight: bold">Date</div></td>
		 <td height="10"><div align="center" style="font-weight: bold">Km</div></td>
		<td height="10"><div align="center" style="font-weight: bold">Evenement</div></td>
		<td height="10"><div align="center" style="font-weight: bold">Prestataire</div></td> 
		<td height="10"><div align="center" style="font-weight: bold">Cout €</div></td>
		<td height="10"><div align="center" style="font-weight: bold">Nombre de minutes</div></td>
		<td height="10"><div align="center" style="font-weight: bold">Commentaire</div></td>
		<td height="10"><div align="center" style="font-weight: bold">Supp</div></td>
		</tr>
		  <%
			MA REQUETE 
 
	Response.write("<tr>")
		Response.write("<td><div align='center'>"&rs3("date")&"</div></td>")
		Response.write("<td><div align='center'>"&rs3("km")&"</div></td>")
		Response.write("<td><div align='center'>"&rs3("Libelle")&"</div></td>")
		Response.write("<td><div align='center'>"&rs3("libellé")&"</div></td>")
		Response.write("<td><div align='center'>"&rs3("montant")&"</div></td>")
		Response.write("<td><div align='center'>"&rs3("nb_heure")&"</div></td>")
		Response.write("<td><div align='center'>"&rs3("commentaire")&"</div></td>")
			%>
		<td align="center" >
		<input id="supp<%=i%>" type="checkbox" value= "toto" name="supp<%=i%>" onclick="test_chckbx();"/>
		<input type="hidden" name="num_materiel<%=i%>" value="num_materiel<%=i%>" />
		<input type="hidden" name="dat<%=i%>" value="dat<%=i%>" />
		<input type="hidden" name="km<%=i%>" value="km<%=i%>" />
		<input type="hidden" name="evenement<%=i%>" value="evenement<%=i%>" />										
	</td>
					<%
								i=i+1							
							Response.write("</tr>")
							rs3.movenext 	
							wend
						end if
					%>
			<tr>		
				  <td></td><td></td><td></td><td></td><td></td><td></td><td></td>
				  <td align="center">
					<input id="validation" name="validation" type="submit" value="Valider" style="visibility:hidden;">
			<%
			i=0
			'For each del.checkbox, si elle est cochée alors ...
				'if affichage.checked then
				del = "delete from parc_gestion_vehicule where num_materiel = num_materiel=" & i 
				del = del & " and dat = dat=" & i 
				del = del & " and km = km=" & i 
				del = del & " and evenement = evenement=" & i 
				'db.execute(del) 
				i=i+1
				'end if
			%>
				  </td>
			</tr>
	 </table>
	  </form>

[ririch]

Code :

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

1
2
3
4
5
6
 
		<input id="supp<%=i%>" type="checkbox" value= "toto" name="supp<%=i%>" onclick="test_chckbx();"/>
		<input type="hidden" name="num_materiel<%=i%>" value="num_materiel<%=i%>" />
		<input type="hidden" name="dat<%=i%>" value="dat<%=i%>" />
		<input type="hidden" name="km<%=i%>" value="km<%=i%>" />
		<input type="hidden" name="evenement<%=i%>" value="evenement<%=i%>" />

et toi tu vois donc plus un truc avec

Code :

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

<input id="supp<%=i%>" type="checkbox" value= "supp<%=i%>" name="supp<%=i%>" onclick="test_chckbx();"/>

En faisant ca, j'attribut a la valeur de ma checkbox, l'incrémentation du i ...
Car selon le materiel choisie, il peut y avoir 1 2 3 ... evenement deja associé.. et ca, je ne peux pas les prédéfinir

[andry.aime]

Tu peux faire quelque chose du genre

Code :

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

Response.write("<td><input id='supp<%=i%>' type='checkbox' value= "&rs3("id_vehic")&" name='supp<%=i%>'/></td>")

Car tu as fait une requête pour remplir le tableau.

[ririch]

peux tu compléter ton idée ?
Je ne comprend pas

[andry.aime]

Tu as fait une requête pour lister l'enregistrement, donc tu reçois les id. Tu n'as qu'à mettre ces id dans les value des checkbox au lieu de la valeur de i. Ainsi quand tu postes la formulaire, tu reçois les id des enregistrements que l'utilisateur sélectionne pour supprimer.

[MoKeS]

J'ai fait exactement le même système pour mon projet.

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
 
var cb = document.getElementsByTagName("input");
 
	function suppArticle()
	{
		for(var i = 0 ; i<cb.length; i++)
		{
			if(cb[i].type=="checkbox" && cb[i].checked==true)
			{
 
				var montd = cb[i].parentNode;
				var montr = montd.parentNode;
				var montab = montr.parentNode;
				var lig = montr.rowIndex;
				var refArticle = montab.rows[lig].cells[0].innerHTML ;
							document.location.href="suppr_article.php?refArticle="+refArticle
 
			}
	        }
 
	}

j'ai récupérer tous les "inputs". et la fonction supArticle() est appelée dès que je cliques sur le bouton SUPPRIMER (pour la séléction).
Je récupère donc l'ID qui est dans la première colonne de la ligne de la checkbox et je fait passer cette ID dans l'url d'une autre page.

Code de suppr_article.php :

Code :

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

1
2
3
4
5
6
 
$refArticle = $_GET['refArticle'] ;
 
$result = $connexion->requete("DELETE FROM commandes WHERE reference_commande='".$_SESSION['panier']."' AND reference_article='$refArticle'");
 
header("Location:".$_SERVER['HTTP_REFERER']) ;

En bref, je récupère l'article passé en URL, et je supprime la ligne correspondante dans la table et je reviens sur la page précédente... ce procédé est quasiment invisible et marche si plusieurs checkbox on étés cochées

MoKeS

[ririch]

Nickel
alors on a quasiment la meme fonction déjà ^^ je suis rassuré.

Code :

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

1
2
3
4
5
6
7
 
var montd = cb[i].parentNode;
var montr = montd.parentNode;
var montab = montr.parentNode;
var lig = montr.rowIndex;
var refArticle = montab.rows[lig].cells[0].innerHTML ;
							document.location.href="suppr_article.php?refArticle="+refArticle

Est ce que tu peux m'expliquer le code ci dessus ?
Moi ma clef c'est un num_materiel, dat, km, evenement...
merci

[MoKeS]

^^ oui sans problèmes :

- var montd = cb[i].parentNode ;

cette ligne là, on récupère le TD où se trouve la checkbox COCHEE.

- var montr = montd.parentNode;

Ici, on récupère la LIGNE (tr) du tableau où se trouve la checkbox cochée grâce au TD récupéré précédemment.


- var montab = montr.parentNode;

Ici on récupère le tableau où se trouve toutes les infos (id, checkbox etc)

- var lig = montr.rowIndex; on récupère l'index de la ligne où se trouve la checkbox COCHEE

- var refArticle = montab.rows[lig].cells[0].innerHTML ;

et avec toutes les informations ci dessus, on récupère l'id. Sachant que chez moi l'ID se trouve dans la première case (donc à la position 0), je dis donc que l'id (reference chez moi) se trouve dans le tableau (montab), à la ligne lig (rows[lig]) dans la cellule 0 (chez moi c'est dans la première case) et je récupère ce qu'il y a dedans (innerHTML).

Ensuite je passe cet id récupérée, dans l'adresse URL de la page qui sert à supprimer. Regarde le code sur mon précédent post que j'ai employé pour faire ça.

[ririch]

a quoi correspond :

Code :

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

header("Location:".$_SERVER['HTTP_REFERER']) ;

C'est ca qui te permet de faire le yoyo et de te rediriger vers ta page précedente ?

[MoKeS]

Exactement ...

ça permet de revenir sur la page précédente ... (un peu comme si tu avais cliqué sur la flèche précédente de ton navigateur)..

[ririch]

Que de bug que de but !!
A nos moutons
alors
j'ai modifier ta fonction js de telle sorte que avec un alert, elle arrive bien a me recupéré mon num_materiel, dat, km et evenement :

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
function suppArticle() {
document.location.href="supp.asp";
	var cb = document.forms['affichage'].getElementsByTagName("input");
	var refmat = document.Materiel.materiel.options[document.Materiel.materiel.selectedIndex].value;
	for(var i = 0 ; i<cb.length; i++) //parcours les input du form
	{
			if(cb[i].type=="checkbox" && cb[i].checked==true)
			{
				var montd = cb[i].parentNode;
				var montr = montd.parentNode;
				var montab = montr.parentNode;
				var lig = montr.rowIndex;
				var refdat = montab.rows[i+1].cells[0].innerHTML ;
				var refkm = montab.rows[i+1].cells[1].innerHTML ;
				var refevt = montab.rows[i+1].cells[2].innerHTML ;
				alert(refmat+"-"+"-"+refdat+"-"+"-"+refkm+"-"+"-"+refevt);
				document.location.href="supp.asp";
 
			}
	 }
			return true;		
}

maintenant j'ai un souci ..
Ou je mets ma requete ?

Quand je clique sur supprimer dans mon form, il regarde ma fonction en js, et reboot sur la meme page (magré le document.location.href.)
En revanche, si dans mon form, je mets "action="supp.asp" alors il se dirige vers elle ... sans afficher mon alert (il ne passe donc pas dans ma fonction)...
help

[andry.aime]

Avec

Code :

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

document.location.href="supp.asp";

Tu rediriges la page mais tu n'envoies pas les données.

Code :

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

1
2
document.forms['nomduform'].action="supp.asp";
document.forms['nomduform'].submit();

Vérifie la methode du form (POST ou GET).

[ririch]

QUOTE]

Avec

Code :

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

document.location.href="supp.asp";

Tu rediriges la page mais tu n'envoies pas les données.

Ca d'accord, c'est exactement ce que j'ai mis dans ma fonction du JS

Code :

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

1
2
document.forms['nomduform'].action="supp.asp";
document.forms['nomduform'].submit();

Vérifie la methode du form (POST ou GET).

Ca je le mets ou exactement ?

[ririch]

C'est la méthode POST que j'utilise

j'arrive bien a dirigé ma page vers supp.asp mais j'ai un souci au niveau des variables récupérés.

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
function suppArticle() {
document.location.href="supp.asp";
	var cb = document.forms['affichage'].getElementsByTagName("input");
	var refmat = document.Materiel.materiel.options[document.Materiel.materiel.selectedIndex].value;
	for(var i = 0 ; i<cb.length; i++) //parcours les input du form
	{
			if(cb[i].type=="checkbox" && cb[i].checked==true)
			{
				var montd = cb[i].parentNode;
				var montr = montd.parentNode;
				var montab = montr.parentNode;
				var lig = montr.rowIndex;
				var refdat = montab.rows[i+1].cells[0].innerHTML ;
				var refkm = montab.rows[i+1].cells[1].innerHTML ;
				var refevt = montab.rows[i+1].cells[2].innerHTML ;
				document.forms['affichage'].action="supp.asp";
				document.forms['affichage'].submit();		
			}
	 }
			return true;		
}

Ma fonction marche et associe au checkbox coché les valeurs refmat pour le materiel, refdat pour la date, refkm pour ....
On se comprend
Mais dans ma requete, je ne sais pas quoi faire figurer

Ceci ne marche pas :

Code :

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

1
2
3
4
5
6
7
8
<%							
	requete = "delete from parc_gestion_vehicule "
	requete = requete & " when num_materiel = "&refmat&"   "
	requete = requete & " and dat =  "&refdat&" "
	requete = requete & " and km = "&refkm&" "
	requete = requete & " and evenement = "&refevt&" "
	response.write(requete)
%>

[andry.aime]

Vires document.location.href="supp.asp" de la fonction.
Ne mets le submit dans la boucle.
Pourquoi tu affectes des variables dans la boucle qui ne sont pas utilisés?
Pour récupérer les variables depuis jsp

Code :

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

response.getParameter('nomduvar');

[ririch]

J'ai abandonné l'idée...
J'ai tout rétabli sur une page. Je m'explique :
une requete en haut de ma page tel que :
si mon formulaire n'est pas vide
alors pour 1 =0 jusqu'a mon cpt (compteur qui compte le nombre de checkbox au total)
si ma checkbox a la ligne 0 n'est pas vide alors.. et je boucle
Dans l'idée c'est pas mal.

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
 <%		
			if request.form("validation") <> "" then 
				for i =0 to request.form("cpt")-1
					 if request.form("supp"&i&"") <> "" then
							requete = "delete from parc_gestion_vehicule "
							requete = requete & " when num_materiel ="&request.form("mat"&i)&" "
							requete = requete & " and dat ="&request.form("'dat'"&i)&" "
							requete = requete & " and km ="&request.form("km"&i)&" "
							requete = requete & " and evenement = "&request.form("'evt'"&i)&" "
							requete = requete & " and prestataire = "&request.form("'pst'"&i)&" "
							response.write(requete)	
					end if					
				next
			end if 
%>

J'ai aussi des champs cachés qui correspondent aux 5 valeurs de ma clef :

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
 
Ma requete ..
<td align="center" >
<input type="checkbox" name="supp<%=i%>" onclick="test_chckbx();">
<input name="dat<%=i%>" type='hidden'  value="<%=dat%>">
<input name="km<%=i%>"  type='hidden'  value="<%=km%>">
<input name="evt<%=i%>" type='hidden'  value="<%=evenement%>">
<input name="pst<%=i%>" type='hidden'  value="<%=prestataire%>">										
</td>
<%
	i=i+1							
Response.write("</tr>")
							rs3.movenext 	
							wend
							 response.write("<input name='cpt' type='hidden' value="&i&">")
						end if
					%>
			<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
				  <td align="center">
					<input id="validation" name="validation" type="submit" value="Valider" style="visibility:hidden;">
				  </td>

Le souci c'est que dans ma requete du haut, elle n'arrive pas a prendre la valeur ...
Si vous voulez, ca m'affiche ça :

delete from parc_gestion_vehicule when num_materiel = and dat = and km = and evenement = and prestataire =

Qu'ai-je oublié ?

merci