2012-10-18 2 views
1

J'ai un code jquery pour supprimer des données ligne par ligne dans ma vue de table. Lorsque l'utilisateur clique sur l'icône de suppression, la boîte de conformation est pop-up et a "Oui" et "Non" bouton. Si "Oui" la ligne est supprimée, si "Non" ferme la boîte de conformation et ne fait rien. Le problème est, je dois vous dire 2 données de ligne comme celui-ci: -jquery boucle ajax sans raison

<tr bgcolor=#ACACAC id='ak1'> 
<td align='center'>1.</td> 
<td>Data 1</td> 
<td>...</td> 
<td>...</td> 
<td>...</td> 
<td align='center'> 
     <img src='image/DocEdit.png' class='editData' id='ID_16'>&nbsp;&nbsp;<img src='image/DocDelete.png' **class='deleteData'** id='**ID_16**'> 
    </td> 
</tr> 

<tr bgcolor=#6D6D6D id='ak1'> 
<td align='center'>2.</td> 
<td>Data 2</td> 
<td></td> 
<td></td> 
<td></td> 
<td align='center'> 
     <img src='image/DocEdit.png' class='editData' id='ID_17'>&nbsp;&nbsp;<img src='image/DocDelete.png' **class='deleteData'** id='**ID_17**'> 
    </td> 
</tr> 

Alors, quand je cliquez sur Supprimer données 1, le ID_16 est passé au code jquery. Que je clique sur "Non" sur la boîte de conformation. Après cela, je clique sur supprimer sur les données 2. Maintenant, je clique sur "Oui" sur la boîte de conformation. Data ID_17 supprimé de la base de données, buat après la suppression de ID_17, mon jquery va boucler et supprimer ID_16 et toutes les données que j'essaye de supprimer avant. C'est comme mettre en file d'attente l'action de suppression pour les données que je choisis "Non" sur la boîte de conformation. Voici mon code jquery.

//.deleteData is class for delete button  
    $('.deleteData').click(function(){ 

    var idData=$(this).attr('id'); //get data id to delete 

    //Fade in the Popup for conformation delete 
    $('#cfm-box').fadeIn(300); 

    //Set the center alignment padding + border see css style 
    var popMargTop = ($('#cfm-box').height() + 24)/2; 
    var popMargLeft = ($('#cfm-box').width() + 24)/2; 

    $('#cfm-box').css({ 
     'margin-top' : -popMargTop, 
     'margin-left' : -popMargLeft 
    }); 

    // Add the mask to body 
    $('body').append('<div id="mask"></div>'); 
    $('#mask').fadeIn(300); 


      //if button no click, do nothing 
      //#no refer to the button ID no. 
      $('#no').click(function(){ 
     $('#mask , .cfm-popup').fadeOut(300 , function() { 
     $('#mask').remove(); 
     }); 
    });//end #no 


      //if yes click, delete data from db 
      //#yes refer to the button ID yes. 
      $('#yes').click(function(){ 

     //parameter to send for delete WHERE statement 
        var tahun = $('#tahunSemasa').val(); 
     var suku = $('#sukuSemasa').val(); 

     var dataString = "tahun="+tahun+"&suku="+suku+"&id="+idData+"&action=delete"; 

     $.ajax({ 
     type: "POST", 
     url: "prestasiProses.php", 
     data: dataString, 
     cache: false, 
     success: function(html) 
     { 
      alert(html); 

      if(html=='true') 
      { 
       window.location.href="main.php?a=31&tahun="+tahun+"&suku="+suku+"&act=delete"; 
      } 
      else 
      { 
       alert("Failed!");  
      } 
     } 
     }); 

     $('#mask , .cfm-popup').fadeOut(300 , function() { 
     $('#mask').remove(); 
     }); 

    });//end #yes 

});//end .deleteData 

Des idées pour lesquelles ce code boucle comme ça?

Merci pour l'aide

+0

Ces lignes ont le même ID. Ce n'est pas une boucle. – Ohgodwhy

+1

Essayez de supprimer les événements de clic 'yes' et' no' depuis l'événement de clic 'deleteData'. –

+0

@RicardoLohmann, je supprime oui et non de l'intérieur deleteData. Cela fonctionne mais comment la façon dont je peux passer l'ID de ligne ID_16 et d'autres paramètre à oui bloquer le code pour supprimer cette ligne? – errorare

Répondre

1

Vous ne devriez pas avoir tout ce code dans votre $('.deleteData').click(function(){. Découvrez this fiddle pour voir comment je pense que vous devriez avoir votre code mis en place. Notez que j'ai fait la idData une variable globale et déplacé votre code $('#no').click(function(){ et $('#yes').click(function(){ vers le bas. Mon violon ne fonctionne pas parce qu'il ne contient pas tous vos éléments, mais devrait vous montrer ce que je veux dire.

J'ai également déplacé votre suppression de masque à l'intérieur de votre gestionnaire ajax success car il semble que vous voulez que cela fonctionne une fois que votre ajax revient. Est-ce le cas?

EDIT: Le problème que vous rencontrez est dû au fait que vous liez des articles avec la classe deleteData plusieurs fois. Lorsque vous exécutez le sélecteur $('.deleteData').click(, vous dites, "get each instance of an element with the class 'deleteData' and then bind this function to it." Puisque vous aviez alors le $('#no').click( et $('#yes').click( INSIDE votre $('.deleteData').click( vous liez votre double $('#no').click( et $('#yes').click(. Si vous aviez trois instances de 'deleteData', votre code ajax aurait été exécuté 3 fois.

+0

désolé. Je fais comme vous suggérer et c'est le travail.Mais j'ai besoin de savoir, pourquoi si je mets ce $ ('# oui'). Click et $ ('# no') .cliquez dans $ ('. DeleteData'). Quelle est la différence si je mets à l'intérieur et à l'extérieur du code? Je veux juste savoir pour que je ne répète pas la même erreur à l'avenir? Merci. – errorare

+0

Je me rends compte que mon montage est un peu déroutant, donc si cela n'a pas de sens, faites le moi savoir et j'entrerai dans les détails. – davehale23

+0

Merci davehale. J'apprends quelque chose de cette erreur. Merci encore. – errorare

1

Le problème est que chaque fois que vous cliquez sur deleteData vous lier cliquez pour yes et no, à si vous cliquez sur deleteData deux fois, vous liez cliquez pour yes et no deux fois, parce qu'il est à l'intérieur deleteData événement click. Pour éviter ce comportement, vous devez le supprimer de l'événement deleteData.

Vous pouvez essayer la démo this.

  • Saisissez le nombre binds voulez-vous
  • Cliquez texte
  • Voyez combien de fois il enregistre la valeur
+0

Merci Ricardo. Je veux voter pour votre réponse, mais je n'ai pas assez de points. En tout cas merci pour votre aide. :) – errorare

+0

@errorare Pas de problème, je veux juste vous aider à comprendre pourquoi cela se passe et comment résoudre. –