Utilisation de jquery sur un bouton dans une liste énumérée

Question

J'ai une vue qui créera une table en énumérant chaque élément de mon modèle. à chaque ligne, j'ai besoin d'ajouter un bouton. J'ai besoin d'avoir une fonction jquery liée à chaque bouton pour afficher une alerte quand on clique dessus. le texte sera différent en fonction de l'élément de ligne sur lequel vous avez cliqué, donc je dois savoir sur quelle ligne le bouton d'édition a été cliqué. est-ce logique? Et comment ferais-je cela?

Voici donc ce que je

<table> 
<% foreach (var item in Model) 
     { %> 
<tr> 
<td><%=Html.encode(item.id) %></td> 
<td><%=Html.encode(item.id) %></td> 
<td><button id="button<%=item.id%>">select<button> 
</tr> 
<%}%> 
</table> 

quelque chose comme ça. Comment puis-je essayer une fonction jquery à chaque bouton. Est-ce possible? Merci!

Answer 1

pas testé, mais devrait fonctionner:

$(function){ 
    $('[id^=button]').click(function(){ 
     var itemId = $(this).attr('id').substring(6); 
     alert(itemId); 
    }); 

} 

Fondamentalement, vous ajoutez l'événement de clic pour tout ce qui a un identifiant qui commence par le bouton. et vous obtenez l'identifiant de l'objet mais en récupérant la sous-chaîne de l'attribut buttons id.

Answer 2

Vous trouverez ci-dessous tous les boutons d'un tableau dont l'identifiant commence par «bouton». Sur la base de votre exemple, cela trouverait tous vos boutons de connexion de données et attacher un gestionnaire onclick qui afficherait une alerte affichant l'identifiant unique du bouton.

$('table tr td button[id^=button]').click(
function (e) { 
alert($(this).id); 
e.preventDefault(); 
}); 

Vous pouvez ensuite modifier cela pour répondre à vos besoins.