Bouton permettant la modification d'une ligne d'un tableau

**susumu** · 30/10/2013, 12h25

Bonjour à tous,

Oui je traîne pas mal dans le coin en ce moment.. Aujourd'hui j'ai une nouvelle problématique à vous proposer:

J'ai suivi un tuto (http://olance.developpez.com/article...cation-inline/), et j'en ai adapté le code pour qu'il fonctionne avec ma base de données. Toutes les fonctionnalités proposées par le tuto fonctionnent.
En double cliquant sur un champ, l'utilisateur peut modifier le contenu et ce contenu est modifié dans la base de données. Exemple ici:http://olance.developpez.com/article...nline/exemple/

C'est très bien tout ça mais c'est pas exactement ce que je veux et je n'arrive pas à adapter mon besoin..
Je voudrais que lorsque une checkbox est cochée, si l'utilisateur appuie sur le bouton modifier, la ligne séléctionnée devienne disponible à l'utilisateur et qu'il puisse la modifier à sa guise.
Voilà ce que donne mon test jusque là:http://imageshack.us/photo/my-images/7/s3zq.jpg/

Si certains parmi vous peuvent m'expliquer comment faire cela, ça m'arrangerait

S'il vous faut un peu de code, demandez =)

**susumu** · 30/10/2013, 13h05

bon j'en balance en fait:

Code php :

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
<div id="actions">	
	<div id="action">
		<form name='formulaire' > 
			<input type="button" style='width: 98%; height: 50px;font-size:16px;' name="ajoutmem" value="Ajouter membre" onclick="ajoutmembre()'" style="background-color:#3cb371" style="color:white; font-weight:bold"onclick>
			<br/>
			<input type="button" style='width: 98%; height: 50px;font-size:16px;' name="modmem" value="Modifier membre" onclick="modmembre()" style="background-color:#3cb371" style="color:white; font-weight:bold"onclick>
			<br/>
			<input type="button"style='width: 98%; height: 50px;font-size:16px;'  name="suppmem" value="Supprimer membre" onclick="supprmembre()" style="background-color:#3cb371" style="color:white; font-weight:bold"onclick>
			<br/>
			<input type="button"style='width: 98%; height: 50px;font-size:16px;'  name="exp" value="Export vers Excel" onclick="exp()'" style="background-color:#3cb371" style="color:white; font-weight:bold"disabled>
		</form>
	</div>
</div>
<div id="erreur"></div>
<br/>
<br/>
<div id="tableaumembre">
	<table>
	<thead> <!-- En-tÃ?Âªte du tableau -->
		<tr id="tab">
			<th><input type="checkbox" onClick="active()" name="sa"/> S.A</th>
			<th>ID</th>
			<th>Login</th>
			<th>Mot de passe</th>
			<th>Nom</th>
			<th>Groupe</th>
			<th>Commentaires</th>
		</tr>
	</thead>
	<tbody> <!-- Corps du tableau -->
<?php
while ($user = mysql_fetch_assoc($result))
{?>
		<tr id="membre">
			<td><INPUT type="checkbox" name="foo" value="1" onClick="active()"></td>
			<td id="idutil-<?php echo $user['idutil']; ?>"  class="cellule" ondblclick="inlineMod(<?php echo $user['idutil']; ?>, this, 'idutil', 'Nombre')"><?php echo $user['idutil']; ?></td>
			<td id="loginutil-<?php echo $user['idutil']; ?>"  class="cellule" ondblclick="inlineMod(<?php echo $user['idutil']; ?>, this, 'loginutil', 'Texte')"><?php echo $user['loginutil']; ?></td>
			<td id="passutil-<?php echo $user['idutil']; ?>"  class="cellule" ondblclick="inlineMod(<?php echo $user['idutil']; ?>, this, 'passutil', 'Texte')"><?php echo $user['passutil']; ?></td>
			<td id="nomutil-<?php echo $user['idutil']; ?>"  class="cellule" ondblclick="inlineMod(<?php echo $user['idutil']; ?>, this, 'nomutil', 'Texte')"><?php echo $user['nomutil']; ?></td>
			<td id="groupeutil-<?php echo $user['idutil']; ?>"  class="cellule" ondblclick="inlineMod(<?php echo $user['idutil']; ?>, this, 'groupeutil', 'Texte')"><?php echo $user['groupeutil']; ?></td>
			<td id="commentairesutil-<?php echo $user['idutil']; ?>"  class="cellule" ondblclick="inlineMod(<?php echo $user['idutil']; ?>, this, 'commentairesutil', 'TexteMulti')"><?php echo $user['commentairesutil']; ?></td>
		</tr>
<?php
}
?>
	</tbody>
	</table>
</div>

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
function getTextWidth(texte)
{
	//Valeur par défaut : 150 pixels
	var largeur = 150;
 
	if(trim(texte) == "")
	{
		return largeur;
	}
 
	//Création d'un span caché que l'on "mesurera"
	var span = document.createElement("span");
	span.style.visibility = "hidden";
	span.style.position = "absolute";
 
	//Ajout du texte dans le span puis du span dans le corps de la page
	span.appendChild(document.createTextNode(texte));
	document.getElementsByTagName("body")[0].appendChild(span);
 
	//Largeur du texte
	largeur = span.offsetWidth;
 
	//Suppression du span
	document.getElementsByTagName("body")[0].removeChild(span);
	span = null;
 
	return largeur;
}
 
	//URL du script de sauvegarde auquel on passe la requête à exécuter
	XHR.open("GET", "sauverMod.php?champ=" + escape(champ.nomChamp) + "&valeur=" + escape(champ.getValeur()) + "&echap=" + champ.echaperValeur() + "&id=" + champ.id + ieTrick(), true);
 
	//On se sert de l'événement OnReadyStateChange pour supprimer l'input et le replacer par son contenu
	XHR.onreadystatechange = function()
	{
		//Si le chargement est terminé
		if (XHR.readyState == 4)
			if(!XHR.responseText)
			{
				//Réinitialisation de la variable d'état d'édition
				editionEnCours = false;
 
				//Sortie du mode d'édition
				champ.terminerEdition();
 
				//Réinitialisation de l'affichage d'erreur
				document.getElementById("erreur").innerHTML = "";
 
				return true;
			}
			else //S'il y a une réponse texte, c'est une erreur PHP
			{
				//Affichage de l'erreur
				document.getElementById("erreur").innerHTML = XHR.responseText;
				sauve = false;
				return false;
			}
	}
 
	//Envoi de la requête
	XHR.send(null);
}
 
Texte.prototype.activerChamp = function ()
{
	input.focus();
	input.select();
}
 
//Fonction de sortie du mode d'édition
Texte.prototype.terminerEdition = function ()
{
	this.parent.replaceChild(document.createTextNode(input.value), this.parent.firstChild);
	delete input;
}
 
//Fonction déterminant si la valeur passée au script PHP doit être formatée par celui-ci ou pas (avec mysql_real_escape_string($str);)
//Ici oui, car il s'agit de texte
Texte.prototype.echaperValeur = function ()
{
	return "true";
}
 
function Texte()
{
	this.id = -1;
	this.valeur = "";
	this.nomChamp = "";
	this.parent = null;
	this.texteErreur = "";
}

**susumu** · 04/11/2013, 10h40

On va faire plus simple: Ce que je veux c'est comprendre comment faire pour qu'au lieu de

Code :

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

ondblclick="inlineMod(<?php echo $user['idutil'];

pour chaque champ du tableau, lorsque qu'une checkbox est sélectionnée, à l'appuie du bouton Modifier, toute la ligne sélectionnée soit en "inlineMod" ?

Merci d'avance,
Susumu

**NoSmoking** · 04/11/2013, 10h49

Bonjour,

à l'appuie du bouton Modifier,

événement onclick

lorsque qu'une checkbox est sélectionnée

teste si la checkbox est checked dans la fonction

**susumu** · 04/11/2013, 11h12

Bonjour,

J'ai crée une fonction active qui permet d'avoir le bouton activé uniquement quand une (et une seule) checkbox est cochée:

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
function active(){
	checkboxes = document.getElementsByName('foo');
	compt = 0;
 
		for(var i=0, n=checkboxes.length;i<n;i++) {
			if(checkboxes[i].checked){ 
				compt = 1;
				nb = nb++;
				if(nb=1){
					document.forms['formulaire'].exc.disabled=false;
					document.forms['formulaire'].modmem.disabled=false;
					document.forms['formulaire'].suppmem.disabled=false;
				}
				else
				{
					document.forms['formulaire'].exc.disabled=true;
					document.forms['formulaire'].modmem.disabled=true;
					document.forms['formulaire'].suppmem.disabled=true;
				}
			}			
 
		}
		if(compt==0){
			nb=0;
			document.forms['formulaire'].exc.disabled=true;
			document.forms['formulaire'].modmem.disabled=true;
			document.forms['formulaire'].suppmem.disabled=true;
		}
}

"modmem" étant le bouton de modification, "suppmem" le bouton de suppression et exc l'export vers excel (qui lui est activé même si plusieurs checkbox sont cochées)
Donc lors du lancement de la fonction Modif, la checkbox est forcément cochée

par contre je récup pas l'id de celle-ci :/