Comment obtenir la valeur d'une cellule lorsque l'utilisateur clique sur la ligne du tableau
Vikki
J'essaye d'obtenir la valeur href de la cellule avec la classe editlink. C'est ce que j'ai essayé mais j'entre undefineddans le alert.
<table id="table_1">
<thead></thead>
<tbody>
<tr>
<td>sometext</td>
<td class="editlink"><a href="/linkid444">edit</a></td>
</tr>
<tr>
<td>sometext2</td>
<td class="editlink"><a href="/linkid555">edit</a></td>
</tr>
</tbody>
<tfoot></tfoot>
</table>
$(document).ready(function() {
$("#table_1").delegate("tr", "click", function() {
var linkdata = $(this).closest('tr').find('.editlink').attr("href");
alert(linkdata);
});
});
Rory McCrossan
Notez tout d'abord que cela delegate()est obsolète. À la place, utilisez la signature déléguée de la on()méthode. Cela peut également signifier que vous devez mettre à niveau la version de jQuery que vous utilisez.
Quant au problème que vous avez, c'est parce que .editlinkc'est le td. La hrefpropriété est sur l' aélément, le sélecteur doit donc l'être .editlink a. En outre, closest('tr')est redondant, car le gestionnaire d'événements est déjà lié au tr. Essaye ça:
$(document).ready(function() {
$("#table_1").on('click', "tr", function() {
var linkdata = $(this).find('.editlink a').attr("href");
console.log(linkdata);
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="table_1">
<thead></thead>
<tbody>
<tr>
<td>sometext</td>
<td class="editlink"><a href="/linkid444">edit</a></td>
</tr>
<tr>
<td>sometext2</td>
<td class="editlink"><a href="/linkid555">edit</a></td>
</tr>
</tbody>
<tfoot></tfoot>
</table>