Probleme avec .click()

par **Ryle** » 16 oct. 2011, 19:56

Ton problème vient du fait que c'est au chargement de la page que tu vas modifier les boutons remove pour dire que lorsque l'on clique dessus ils doivent supprimer la ligne. Cependant, les boutons que tu ajoutes dynamiquement par la suite ne sont pas affectés par ce traitement qui a eu lieu au chargement de la page.

Il te faut donc renouveler la chose pour chacun des boutons que tu ajoutes (attention d'ailleurs, dans ton code les boutons ajoutés ont tous le même id alors que celui-ci devrait être unique dans la page), ou simplement définir une action onclick sur le bouton que tu ajoutes...

par **Pascal64** » 12 oct. 2011, 18:20

Bonjour à tous,

Cela fait bientôt deux heures que je bloque sur un problème. J'utilise .remove et .append pour supprimer et ajouter des lignes dans mon div. Il m'est impossible de les effacer lorsuqe je click sur "Remove" et je ne comprends pas pourquoi. Pouvez-vous m'aider svp.

Code html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="../script/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
 
$(document).ready(function(){
 
    var counter = 2;
 
    $("#addButton").click(function () {
 
	if(counter>10){
            alert("Only 10 textboxes allow");
            return false;
	}   
 
	var newTextBoxDiv = $(document.createElement('li'))
	     .attr("id", 'itemFiltreActif' + counter).attr("class", 'itemFiltreActif');
 
	//newTextBoxDiv.after().html('<label>Textbox #'+ counter + ' : </label>' +
	//      '<input type="text" name="textbox' + counter + 
	//      '" id="textbox' + counter + '" value="" >');
 
 
 	newTextBoxDiv.append().html(counter +' <input value="Remove Button" id="removeButton" type="button" class="removeButton">');
 
	newTextBoxDiv.appendTo("#contenuFiltreActif");
 
 
	counter++;
     });

     $("input.removeButton").click(function () {
	alert(counter);
	if(counter==1){
          alert("No more textbox to remove");
          return false;
       }   
 
	counter--;
 
        $("#itemFiltreActif" + counter).remove();
 
     });
 
  });
</script>

</head>
<body>

        <div class="contenuFiltre">
            <ul id="contenuFiltreActif" class="contenuFiltreActif">
               <li class="titreFiltreActif">Mes filtres</li>
<!--                      <li id="itemFiltreActif1" class="itemFiltreActif">CDI <img src="../images/picot_suppirmer_filtre.png" width="10" height="10" /></li>
                <li id="itemFiltreActif2" class="itemFiltreActif">Ile de france  <input value="Remove Button" id="removeButton" type="button" class="removeButton"></li>-->
           
<input value="Add Button" id="addButton" type="button">
            </ul>
  </div>
</body>
</html>

Probleme avec .click()

Répondre

Étendre la vue Revue du sujet : Probleme avec .click()

Re: Probleme avec .click()

Probleme avec .click()