[JavaScript] removeChild ne met pas à jour

Fermé
Mc Flurry Messages postés 5 Date d'inscription jeudi 14 avril 2011 Statut Membre Dernière intervention 26 mai 2011 - Modifié par Mc Flurry le 26/05/2011 à 11:18
Bonjour,

j'ai un problème avec mon code JavaScript ( mon premier programme, soyez indulgent svp :) )

Ce que je veux faire me semble très simple, j'ai un select et un bouton à coté.
Au click du bouton, je récupère la valeur courante du select, et je crée une div avec un champ remplit, un textearea, et un bouton supprimer.

L'ajout se passe très bien mais à la suppression j'ai un bug. Si j'ajoute plusieurs div et que j'en supprime une autre que la dernière et bien, les div qui lui succède ne se décalent pas avec le reste, il faut attendre le survol du bouton supprimer pour que tout se remette en place.

J'avoue que je ne comprends pas.

Précision : je dois coder pour IE 7.

function ajouterCommune(){  
 var nb_com = document.getElementById('nb_com');  
 nb_com.value ++;  
   
 idd++;  
 var liste = document.getElementById('listeCom');  
 var indice = liste.selectedIndex;  
 var valeur = liste.options[liste.selectedIndex].value;  
    
 var cadreDiv = document.createElement("div");   
 cadreDiv.id = idd;  
 cadreDiv.className = "ajoutCom";  
 cadreDiv.name = valeur;  
   
 var libDiv = document.createElement("div");   
 libDiv.className = "libDiv";   
   
 var label = document.createElement("input");  
 label.type="text";  
 label.className = "inputJS";  
 label.value=valeur;  
 label.name = idd.toString();   
   
 var bouton = document.createElement("button");  
 bouton.className = "bouton";  
 bouton.id="boutonJS";  
 bouton.value = "Supprimer";  
 bouton.supprimer =   
 function(){  
  alert("L'élement "+cadreDiv.id+" "+cadreDiv.name+" va etre supprimé.");  
  document.getElementById('divInsert').removeChild(cadreDiv);  
  liste.add(new Option(valeur, valeur), 0);  
  nb_com.value --;  
 }  
 bouton.onclick = bouton.supprimer;  
   
 var txtDiv = document.createElement("div");  
 txtDiv.className = "txtDiv";   
   
 var area = document.createElement("textarea");  
 area.rows = 4;  
 area.cols = 50;  
 area.value = consigne;  
 area.name = valeur;   
 area.effacer=    
 function(){  
  if(area.value==consigne)area.value='';  
 }  
 area.onfocus = area.effacer;    
   
   
 libDiv.appendChild(label);  
 libDiv.appendChild(bouton);  
 txtDiv.appendChild(area);  
 cadreDiv.appendChild(libDiv);  
 cadreDiv.appendChild(txtDiv);  
   
 document.getElementById('divInsert').appendChild(cadreDiv);  
 liste.removeChild( liste.options[indice]);  
}  


Merci de votre aide.