2009-08-07 5 views
1

i am a généré une table dynamique qui ressemble à ceci:tableau dynamique où je peux cliquer sur le lien et saisir des informations contextuelles

Nom de l'action
==== =======
Adam Supprimer
Joe supprimer
Bill supprimer

Je veux « supprimer » pour un lien qui ouvre une fenêtre de confirmation qui dit:

« êtes-vous sûr de vouloir supprimer » Adam "? (Oui, Non)

Notez que "adam" est contextuel et doit être récupéré à partir de la ligne de la table où l'utilisateur l'a sélectionné.

Répondre

2

Quelque chose comme ceci:

$(document).ready(function() { 
    $('a.delete').click(function(e) { 
     //prevent the link from going anywhere 
     e.preventDefault(); 
     //give me this link's parent (a <td>) and grab the text of the 'prev' one 
     var name = $(this).parent().prev('td').text(); 
     var answer = confirm("Are you sure you want to delete " + name); 
    }); 
}); 

En supposant que vous donnez vos liens de suppression de la classe delete.

+0

Où est-ce que je devrais mettre ce code? – leora

+0

Dans votre $ (document) .ready(), dans les balises de script, dans le HEAD de votre document. – karim79

+0

désolé d'être une douleur, mais je suis toujours perdu. Je l'ai mis en haut, mais où associer le lien avec cette fonction? – leora

0

Cela devrait fonctionner sur toutes les structures de tables que vous avez mentionnées.

<html> 
<head> 
<!-- you will need jQuery --> 
<script type='text/javascript' src='path/to/jquery.js' ></script> 
<script type='text/javascript'> 
$(function() { 
    $("td[innerHTML*='delete']").click(function(e) { 

     var name = $(this).prev('td').text(); 

     if(confirm("Are you sure you want to delete " + name)) 
     { 
      // call ajax to delete this record 

      // remove tr element 
      $(this).parent().remove(); 
     } 
    }); 
}); 
</script> 
</head> 
<body> 
    <!-- your table --> 
    <table> 
     <tr> 
     <td>Mira</td> 
     <td>delete</td> 
     </tr> 
     <td>Adam</td> 
     <td>delete</td> 
     <tr> 
     <td>Barney</td> 
     <td>delete</td> 
     </tr> 
     <tr> 
     <td>Scott</td> 
     <td>delete</td> 
     </tr> 
    </table> 
</body> 
</html> 
Questions connexes