[DOM] innerhtml et fermeture de balise

**riete** · 20/10/2008, 17h56

Quand j'utilise la propriété innerhtml, je n'arrive pas à refermer les balise HTML car le slash pose problème.
Voici mon code:

Code :

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

resultat.innerHTML += '<td class=modif colspan=9>Un texte de test<\/td>';

**SpaceFrog** · 20/10/2008, 18h00

passe plutot par le DOM pour ajouter une cellule ...

**Auteur** · 20/10/2008, 18h03

voir cette discussion

ou la

: ajouter une ligne

**riete** · 20/10/2008, 19h04

Merci pour vos infos, ca gazouille. Sauf que maintenant j'ai une autre question.

Comment puis-je éviter de créer une case supplémentaire à chaque fois que le client click? Existe-t-il un test qui me permette de savoir si une cellule existe je la détruit ?

La fonction de 'delete' devrait pouvoir être conditionnelle (une bascule), mais je ne sais pas comment ?
Merci

Code :

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

1
2
3
4
5
6
7
8
9
resultat.deleteCell(0);
	Case = resultat.insertCell(0);
	Case.className="tdmodif";
	Case.colSpan=9;
 
	for (i=0;i<items.length;i++)
	{
		Case.innerHTML += items.item(i).firstChild.data + " ";
	}

**Auteur** · 22/10/2008, 15h40

attention tu utilises un nom de variable qui peut prêter à confusion :
tu as une variable Case, tu risques de confondre avec le mot clef case :

Code :

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

1
2
3
4
5
6
7
8
9
 
switch (variable)
{
   case 0: // instruction
              break;
   case 1: // instruction
              break;
  // etc. 
}

**riete** · 22/10/2008, 17h26

Merci pour l'infos, mais compte tenu de la remarque constructive de SpaceFrog, je me suis penché sur les fonctions insertRow(), insertCell() et autres propriétés rowIndex... du DOM, ce qui est bien plus propre.

Je créé maintenant dynamiquement des lignes dans des <table>.

Par contre je suis toujours en train de me débattre avec les "display: none;" ou "display: table-row;".
Mon objectif étant de faire apparaitre une "ligne formulaire" au dessus de la ligne que l'utilisateur veut modifier dans un tableau de données.

Je ne sais pas quel nom porte cette technique, mais elle est courante sur des sites bien fait et conviviaux.
En cours de consultation d'une liste de données sous forme de tableau. L'utilisateur, peut en cliquant sur le bouton modif de la ligne faire apparaitre une nouvelle ligne qui lui permet d'entrée en mode modification.

J'aimerais pouvoir comparer ma méthode, complexité et le résultat avec d'autres. Si vous avez des liens, je suis preneur.
Merci

**RomainVALERI** · 22/10/2008, 18h28

Envoyé par riete

... je me suis penché sur les fonctions insertRow(), insertCell() et autres propriétés rowIndex... du DOM...

Dans ton cas, va peut-être aussi jeter un oeil sur insertBefore()

**riete** · 23/10/2008, 10h03

Envoyé par RomainVALERI

Dans ton cas, va peut-être aussi jeter un oeil sur insertBefore()

Bien tenté Romain, mais

MS n'est même pas capable de mettre en exemple qui fonctionne. Dans cet exemple, il est fait appel à un objet "oUL1" qui n'est pas déclarer. Comme je ne travail pas avec IE :-/.
Quoi qu'il en soit merci quand même.

Code :

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

1
2
3
4
5
6
function insertElement()
    {
        var nod=document.createElement("li");
        oUL1.insertBefore(nod, oLIYellow);
        nod.innerText="Orange";
    }