réordonner un tableau créé dynamiquement
Bonjour à tous.
J'écris une petite application en javascript : je crée ( ajouteEltNew ) et efface ( supprimeEltNew ) dynamiquement des lignes dans un tableau ( listeEltNew ). Celà fonctionne bien. Mais je voudrais avoir la possibilité de changer la position des lignes (getup, getdown), mais aussi que l'indiçage soit mis à jour.
Je peux avoir des trous dans mes indices car je peux effacer des lignes dynamiquement
Par exemple, si j'ai :
tr0 => blabla
tr2 => bleble
tr6 => blibli
tr7 => bloblo
si je monte la ligne tr 6 d'un rang (à la deuxième place)
je veux avoir :
tr0 => blabla
tr2 => blibli
tr6 => bleble
tr7 => bloblo
Pourriez-vous m'aider à résoudre ce problème ? Merci d'avance.
Je vous donne le code que j'ai :
Code:
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
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
<title>Réordonner un tableau</title>
<script type="text/javascript">
//<![CDATA[
var inc_e=0;
//Ajoute des lignes pour les documents
function ajouteEltNew(incval, nom)
{
if (incval > 0 && inc_e == 0){inc_e = incval;}
var leparent = document.getElementById("listeEltNew");
var tr = document.createElement('tr');
var td1 = document.createElement('td');
var td2 = document.createElement('td');
var td3 = document.createElement('td');
leparent.appendChild(tr);
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
tr.id = "idN"+inc_e;
tr.setAttribute('id', "idN"+inc_e);
td1.innerHTML = '<a onclick="getup('+inc_e+')" class="upElt">up</a>--'
+'<a onclick="getdown('+inc_e+')" class="downElt">down</a>';
td2.innerHTML = '<input name="elt'+nom+inc_e+'" type="text" id="elem'+inc_e+'" size="15" /> '
+'<input type="hidden" name="valeur[]" value="'+inc_e+'" />';
td3.innerHTML = '<a href="#'+nom+'" onclick="supprimeEltNew(\''+inc_e+'\', \''+nom+'\');\">Supprimer elt '+inc_e+'<\/a>';
inc_e++;
}
function supprimeEltNew(incval, nom)
{
var leparent = document.getElementById("listeEltNew");
var letr = document.getElementById("idN"+incval);
leparent.removeChild(letr);
}
function getup(inc)
{
}
function getdown(elt, inc)
{
}
//]]>
</script>
</head>
<body>
<a onclick="ajouteEltNew(0, 'texte');">Ajouter</a>
<form action="test.htm" method="post" id="choixelemform">
<fieldset>
<table id="tableEltNew"><tbody id="listeEltNew"></tbody></table>
<input type="submit" value="Valider" id="validForm" />
</fieldset>
</form>
</body></html> |
