Discussion :

[jeannot1974]

Bonjour,

je souhaiterai ajouter dynamiquement des lignes (<tr></tr>) à un tableau html (avec alternance de couleur pour chaque nouvelle ligne), à chaque fois que je clique sur un bouton... en clair mettre en place un "Partial Update" comme décrit sur http://ditch.developpez.com/javascript/partialupdate/.

Le souci c'est que j'ai une erreur "Objet attendu ligne 50, car. 3" si je teste le code fournit en exemple... et je n'arrive pas à comprendre d'où vient le problème...

Je suis sous IE5... merci de m'éclairer...

[Matthieu2000]

http://javascript.developpez.com/faq/?page=Table

[jeannot1974]

Concernant le script cité en référence, en fait le ChangeFrameLocation est une fonction perso, il faut remplacer par document.getElementById("FrameMiseAJour").src = "file.html";

Ceci étant dit, j'ai une nouvelle erreur sur la 2e fonction (objet attendu également) :
function UpdateEtape2() {
if (obj = getObjectById('Contenu')) {
obj.innerHTML = window.frames['FrameMiseAJour'].document.body.innerHTML;
}

Et je vois toujours pas comment je pourrais gérer dynamiquement mon tableau de la page appelante...

Une idée ???

[jeannot1974]

http://javascript.developpez.com/faq/?page=Table

Merci... je vais voir ça de suite !

[jeannot1974]

Merci... je vais voir ça de suite !

Ca correspond effectivement parfaitement avec ce que je veux faire.

Maintenant, je souhaiterai appliquer un style différent (en alternance) à chaque nouvelle ligne.
Via un champ caché, je suis en mesure de déterminer à la limite quel style appliquer, mais le souci, c'est que je ne vois pas comment en Javascript, je veux spécifier le style à appliquer au niveau de la ligne :

var newCell = newRow.insertCell(0);
newCell.innerHTML = document.all.TXTCodeProduit.value;
newCell = newRow.insertCell(1);

Ci dessus, je crée la ligne, avec autant de cellules que nécessaire, mais me reste plus qu'à spécifier le style, et je trouve de réponse à ma question...

Auriez-vous une idée ???

[Matthieu2000]

newRow.className="leStyle";

[jeannot1974]

Efficace

Merci...

PS : Je ne clos pas encore le post... on ne sait jamais

[jeannot1974]

Suite de ma problématique tableau...

Dans les cellules que j'écris, je souhaite mettre une image... Quelle syntaxe utilisée ???

Le code ci-dessous ne fonctionne pas

newCell.innerHTML = "<img name='SupLig' id='SupLig' src='..\images\p-sup.gif' style='cursor:hand' alt='Supprimer la ligne'>";

[Arnard]

ce serait pas plu simple de mettre ton image ds un div avec un display:none ?

ainsi tu n'aurais que le display à changer pour affiher ton image

[jeannot1974]

ce serait pas plu simple de mettre ton image ds un div avec un display:none ?

ainsi tu n'aurais que le display à changer pour affiher ton image

En fait l'idée c'est que dynamiquement j'ajoute des lignes dans un tableau (issue d'une combo), et en fin de chaque ligne, je veux mettre un bouton qui me permette de supprimer la dite ligne si besoin...

[jeannot1974]

En fait l'idée c'est que dynamiquement j'ajoute des lignes dans un tableau (issue d'une combo), et en fin de chaque ligne, je veux mettre un bouton qui me permette de supprimer la dite ligne si besoin...

En fait ça venait que j'avais mis "\" au lieu de "/" dans le chemin... on va y arriver...

Bonne syntaxe : newCell.innerHTML = "<img src='../images/p-sup.gif' style='cursor:hand' alt='Supprimer la ligne'>";

[jeannot1974]

Donc maintenant j'ai mon tableau dynamique, avec mon alternance de couleur, nickel, mon bouton de suppression...

Je me pose la question de la conversion de l'alternance de couleurs de mes lignes, dès lors que j'en supprime une...
En effet si j'ai une ligne noire, puis une ligne blanche, puis une ligne noire, que je supprime la ligne blanche, j'ai alors 2 lignes noires à la suite...
Donc en fait, il me faudrait suite à la suppression, balayer tout mon tableau pour réinitialiser la couleur de ligne, et rafraichir par la même occasion, l'index identifiant le numéro de ligne (qui me sert à supprimer la ligne)...

Bon je vais y réfléchir et vous tiendrai au courant... mais je sens l'appel du week-end

[jeannot1974]

Bonjour...

Dans la continuité de mes posts précédents, je cherche désormais à balayer dynamiquement mon tableau (notamment après une suppression de ligne), pour "refaire" la mise en page...

Je cherche donc un moyen de modificer le style de toute une ligne (<tr>...</tr>), avec une fonction du même genre que insertRow(), deleteRow()...

PS : Désolé, mais j'suis débutant, et je me pose les questions, tout en cherchant de mon côté (et surtout en cherchant à gagner du temps en demandant à ceux qui savent...).

Merci bien...

[Matthieu2000]

http://www.developpez.net/forums/sho...mentsByTagName

[jeannot1974]

Pour info, voici ce qui a finalement était écrit (ça peut toujours servir à quelqu'un) :

A noter, que le nombre de lignes du tableau, est stocké dans un champ caché, pour divers traitements (y compris hors mise en page), nommé "HIDNbLignes".

Fonction de suppression de ligne avec remise en page :

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
 
function SupprimerLignes(num_ligne)
{
	var nbrLignes;
	var cTabLign;
	var iLign;
	var iCodPdt;
	document.getElementById('TBLlignes').deleteRow(num_ligne);
	nbrLignes = document.getElementById('HIDNbLigne').value;
	nbrLignes--;
	document.getElementById('HIDNbLigne').value = nbrLignes;
	//On refait la mise en page du tableau
	for (var i = 1; i <= nbrLignes; i++) {
		if (i%2==0) {
			cTabLign = "cTabLigP";
		}
		else {
			cTabLign = "cTabLigI";
		}
		//Récupération du contenu de la ligne
		iLign = document.getElementById('TBLlignes').rows[i];
		//Récupération du Code Produit de la ligne
		iCodPdt = document.getElementById('TBLlignes').rows[i].cells[0].innerHTML;
		//Affectation nouveau style à la ligne en cours de traitement
		iLign.className = cTabLign;
        iLign.cells[2].innerHTML = "<img src='../images/p-sup.gif' style='cursor:hand' alt='Supprimer la ligne : "+iCodPdt+"' onclick='javascript:SupprimerLignes("+i+")'>";
    }
}

Fonction appelée lors du clic sur un bouton d'ajout de produit (dont on récupère les infos dans une combo) :

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
 
function AjouterLignes(co_pdt)
{
	var nbrLignes;
	var cTabLign;
	if (document.all.TXTCodeProduit.value=='') {
		alert("Aucun Produit n'est sélectionné");
	}
	else {
		nbrLignes = document.getElementById('HIDNbLigne').value;
		if (document.getElementById('HIDNbLigne').value=='0') {
			document.getElementById('DIVlignes').style.visibility='visible';
			document.getElementById('DIVlignes').style.display='block';
		}
		nbrLignes++;
		document.getElementById('HIDNbLigne').value = nbrLignes;
 
		//Détermination de la couleur de ligne du tableau
		if (nbrLignes%2==0) {
			cTabLign = "cTabLigP";
		}
		else {
			cTabLign = "cTabLigI";
		}
 
		//Ajout d'une ligne au tableau (en fin de tableau)
		var newRow = document.getElementById('TBLlignes').insertRow(-1);
		newRow.className=cTabLign; 
		var newCell = newRow.insertCell(0);
		newCell.innerHTML = document.all.TXTCodeProduit.value;
		newCell.align="center";
		newCell = newRow.insertCell(1);
		newCell.innerHTML = document.all.CMBProduit.options[document.all.CMBProduit.selectedIndex].text;
		newCell = newRow.insertCell(2);
		newCell.align="center";
		newCell.innerHTML = "<img src='../images/p-sup.gif' style='cursor:hand' alt='Supprimer la ligne : "+document.all.TXTCodeProduit.value+"' onclick='javascript:SupprimerLignes("+nbrLignes+")'>";
	}
}

En espérant que cela sera utile à quelqu'un... et merci à tous pour vos coups de pouce...