JQuery’de Tablo Üzerindeki TD Değerlerini Almak
JQuery’de Tablo Üzerindeki TD Değerlerini Almak
Herkese merhaba,
Bu yazıda tablo üzerindeki TD değerlerini almak hakkında bilgi vereceğim.
Aşağıdaki kod yardımıyla siz de bu işlemi rahatlıkla yapabilirsiniz.
HTML Kodu
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head>
<body>
<table border='1' id="uruntablom">
<tr>
<th>Id</th>
<th>Ürün Adı</th>
<th>Açıklama</th>
<th></th>
</tr>
<tr>
<td>1</td>
<td>Buzdolabı</td>
<td>Yiyecekleri soğutmak için kullanılır</td>
<td><button class="btnsec">Seç</button></td>
</tr>
<tr>
<td>2</td>
<td>Televizyon</td>
<td>Film ve video izlemek için kullanılır</td>
<td><button class="btnsec">Seç</button></td>
</tr>
</table>
</body>
</html>JQUERY Kodu
$(document).ready(function(){
$("#uruntablom").on('click','.btnsec',function(){
var secilisatir=$(this).closest("tr");
var kolon1=secilisatir.find("td:eq(0)").text();
var kolon2=secilisatir.find("td:eq(1)").text();
var kolon3=secilisatir.find("td:eq(2)").text();
var veri=kolon1+"\n"+kolon2+"\n"+kolon3;
alert(veri);
});
});[codepen_embed height=300 theme_id=1 slug_hash=’GRvPjaR’ user=’yavuzselimkart’ default_tab=’html’ animations=’run’][/codepen_embed]
Herkese çalışma hayatında ve yaşamında başarılar kolaylıklar.
