JQuery’de Tablodaki TD Değerlerinin Alınması

Herkese merhaba,

Bu yazıda tabloki td etiketinin içindeki değerlerin alınması ile ilgili bilgi vermeye çalışacağım.

Programlama dünyasında tablo üzerinde td etiketinin içindeki değerlerin alınması ihtiyacı olabilir. Çoğunlukla böyle şeylere ihtiyaç duyarsınız.

Aşağıdaki kod yardımıyla siz de bu işlemi rahatlıkla yapabilirsiniz.

HTML Kodu

<table class="table" border='1' id="tablomuz">
   <tr>
      <th>Id</th>
      <th>Ürün Adı</th>
      <th>Açıklama</th>
      <th>Veri Al</th>
   </tr>
   <tr>
      <td><span>1</span></td>
      <td><strong class='urun-ad'>Buzdolabı</strong></td>
      <td>
         <p>Buzdolabı ile ilgili bilgiler <span class="urun-fiyat">15000TL</span>
         <p>
      </td>
      <td>
         <button class="btnSec btn btn-primary btn-block">Bilgi Al</button>
      </td>
   </tr>
   <tr>
      <td><span>2</span></td>
      <td><strong class='urun-ad'>Çamaşır Makinesi </strong></td>
      <td>
         <p>Çamaşır makinesi ile ilgili bilgiler <span class="urun-fiyat">6000TL</span>
         <p>
      </td>
      <td>
         <button class="btnSec btn btn-primary btn-block">Bilgi Al</button>
      </td>
   </tr>
   <tr>
      <td><span>3</span></td>
      <td><strong class='urun-ad'>Sony z3</strong></td>
      <td>
         <p>Bulaşık makinesi ile ilgili bilgiler<span class="urun-fiyat"> 5000TL</span>
         <p>
      </td>
      <td>
         <button class="btnSec btn btn-primary btn-block">Bilgi Al</button>
      </td>
   </tr>
</table>

JQUERY Kodu

$(document).ready(function() {

    $("#tablomuz").on('click', '.btnSec', function() {

        var currentRow = $(this).closest("tr");

        var kolon1 = currentRow.find(".urun-ad").html();
        var kolon2 = currentRow.find(".urun-fiyat").html();

        var data = kolon1 + "\n" + kolon2;

        alert(data);
    });
});

[codepen_embed height=300 theme_id=1 slug_hash=’bGapBPJ’ user=’yavuzselimkart’ default_tab=’html’ animations=’run’][/codepen_embed]

Herkese çalışma hayatında ve yaşamında başarılar kolaylıklar.