[résolu] Modifier contenu d'une cellule <td> suite à un clique

Bonsoir,

j'essai de modifier le contenu d'une cellule de tableau avec la propriété document.getElementById,

voici le code qui génère le tableau :

echo '<table><tr>
						<td>titre du livre</td>
						<td>auteur(s)</td>
						<td>prix</td>
						<td>remise</td>
						<td>quantité</td>
						<td>&nbsp;</td>
					</tr>';
		while ($ligne = pg_fetch_assoc($resultat_de_la_requete)) {
			$i++;
			echo '<tr>
					<td>'.$ligne['design_article'].'</td>
					<td>'.$ligne['auteurs_article'].'</td>
					<td>'.$ligne['prix_article'].'</td>
					<td>'.$ligne['promo_article'].'</td>';
				echo '<td id="qte'.$i.'">'.$ligne['qte_article'].'</td> [b] <== c'est ici que je souhaite changer la quantité qui figure dans la cellule[/b]
					
					<td><form name="form'.$i.'">
						<input type="hidden" name="ajouter" value="'.$ligne['qte_article'].'" />
						<input type="hidden" name="id_ligne" value="'.$ligne['id_ligne'].'" />
						<input type="hidden" name="valeur_i" value="'.$i.'" />
						<input type="button" value="+" onclick="getId_ligne(\'form'.$i.'\')" /> 
						</form></td>
				</tr>';	
		}
		echo '</table>';

Voici le code javascript qui s'exécute dans une fonction callback puisque la nouvelle valeur est récupérée grâce à une requête Ajax :

function resultat_script_panier_qte_inc_php() {
	if (requete.readyState == 4) {
		if (requete.status == 200) {
		var donnees=requete.responseText;
		var elements = nouvelle_quantite.split(';');
		alert(elements[0]);
		alert(elements[1]);
		document.getElementById("qte"+elements[1]).value = elements[0]; [b]<== ligne qui doit modifier le contenu de l'id concerné[/b]
		
		}
	}

}

Je croyais qu'il était possible d'accéder à n'importe quel élément à partir de son id, et là le contenu ne se modifie pas.

Me suis je trompé ?

Merci pour votre aide.
Modifié par manu_css (18 Apr 2007 - 18:28)

Bien sûr qu'on peut mais la propriété value n'est interprétée que par les champs de formulaire.
Tu peux utiliser par exemple utiliser innerHTML mais je crois qu'il y existe de meilleures méthodes donc si qqn pouvait nous préciser çà ce serait gentil.

personne n'a d'autres idées ? En attendant je vais m'empresser de comprendre innerHTML que je ne connaissais pas.

Au passage je voulais signaler ce lien, j'ai suivi à la lettre ce qui était proposé mais là encore, aucun résultat.
Modifié par manu_css (02 Jan 2007 - 23:16)

CNeo, avec innerhtml, ça n'a pas fonctionné. Le contenu n'est pas modifié. Je me suis peut être trompé. voici ce que j'ai écrit dans ma fonction javascript qui doit s'exécuter au clique :

document.getElementById["qte"+elements[1]].innerHTML = "15";

Voici la ligne html concernée :

echo '<td id="qte'.$i.'">'.$ligne['qte_article'].'</td>

Puisque la page n'est pas rechargée, j'aurais du obtenir "15" dans la balise td, mais là rien

Help me !
Modifié par manu_css (02 Jan 2007 - 23:49)

Salut !

manu_css a écrit :
voici ce que j'ai écrit dans ma fonction javascript qui doit s'exécuter au clique :

document.getElementById["qte"+elements[1]].innerHTML = "15";

Il faut utiliser des () par des [] pour getElementById.

Sinon, tu crées un formulaire par ligne ? C'est un peu bourrin tu trouves pas ?

Salut,

Comme le dit CNeo, innerHTML n'est pas la meilleur solution.

Je te conseil ce site pour apprendre les (bonnes) bases de la manipulation du DOM et DHTML.

merci pour votre aide, je vais apprendre les (bonnes) bases de la manipulation DOM et DHTML de ce pas.

Je posterai une solution dès que je l'aurai.

En attendant j'utilise effectivement un formulaire, mais le pb est qu'il s'affiche une zone de saisie. Ce n'est donc pas très esthétique. De plus cela m'oblige à faire un contrôle sur ce qui est saisie dans le champ.

finalement j'ai résolu le pb avec la propriété innerHTML. Ce n'est certes pas la solution normalisée (utilisation du DOM par exemple) mais en tout cas ça fonctionne.

Merci à tous ceux qui m'ont aidé.