Cara hapus data pada jquery

gan disini saya punya kasus saya ingin menghapus tr dengan class ="miss" pada sebuah tabel melalui tombol button dengan class ="del" menggunakan jquery tetapi saya ingin data yg dipilih aja yg dihapus contoh :

saya ingin menghapus barang 2 nah yang tersisa dari tabel berikut adalah barang 1 dan barang 3

<table>
<tr class="miss">
    <td>barang1</td>
    <td>jenis1</td>
    <td><button class="del">hapus</button></td>
</tr>
<tr class="miss">
    <td>barang2</td>
    <td>jenis2</td>
    <td><button class="del">hapus</button></td>
</tr>
<tr class="miss">
    <td>barang3</td>
    <td>jenis3</td>
    <td><button class="del">hapus</button></td>
</tr>
</table>

btw saya tidak memakai database datanya static

avatar yogapermana
@yogapermana

39 Kontribusi 10 Poin

Diperbarui 5 tahun yang lalu

4 Jawaban:

Coba beri id pada table nya contoh : tb_barang Kasih code javascript ini Untuk rows dengan class pilihan yang akan terhapus untuk contohnya :

<script> var table = $('#tb_barang').DataTable();

var rows = table .rows( '.pilihan' ) .remove() .draw(); </script>

avatar alvinindra
@alvinindra

10 Kontribusi 6 Poin

Dipost 5 tahun yang lalu

coba pake ini <pre> &lt;script src="https://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt; &lt;scrupt&gt; $(".del").click(function(){ var index = $('button').index( this ); $( "tr:eq("+index+")" ).remove(); }) &lt;/script&gt; </pre>

avatar dianarifr
@dianarifr

642 Kontribusi 316 Poin

Dipost 5 tahun yang lalu

saya kasih 2 cara

Menggunakan onclick

<pre> &lt;table&gt; &lt;tr class="miss" onclick="deleteBarang(this)"&gt; &lt;td&gt;barang1&lt;/td&gt; &lt;td&gt;jenis1&lt;/td&gt; &lt;td&gt;&lt;button class="del"&gt;hapus&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr class="miss" onclick="deleteBarang(this)"&gt; &lt;td&gt;barang2&lt;/td&gt; &lt;td&gt;jenis2&lt;/td&gt; &lt;td&gt;&lt;button class="del"&gt;hapus&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr class="miss" onclick="deleteBarang(this)"&gt; &lt;td&gt;barang3&lt;/td&gt; &lt;td&gt;jenis3&lt;/td&gt; &lt;td&gt;&lt;button class="del"&gt;hapus&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt;

&lt;script&gt; function deleteBarang(el) { $(el).remove(); } &lt;/script&gt; </pre>

Menggunakan jquery listen onclick

<pre> &lt;table&gt; &lt;tr class="miss"&gt; &lt;td&gt;barang1&lt;/td&gt; &lt;td&gt;jenis1&lt;/td&gt; &lt;td&gt;&lt;button class="del"&gt;hapus&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr class="miss"&gt; &lt;td&gt;barang2&lt;/td&gt; &lt;td&gt;jenis2&lt;/td&gt; &lt;td&gt;&lt;button class="del"&gt;hapus&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr class="miss"&gt; &lt;td&gt;barang3&lt;/td&gt; &lt;td&gt;jenis3&lt;/td&gt; &lt;td&gt;&lt;button class="del"&gt;hapus&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt;

&lt;script&gt; $("table &gt; tr").each(function(){ $(this).click(function(){ $(this).remove() }) }) &lt;/script&gt; </pre>

avatar codenoid
@codenoid

14 Kontribusi 13 Poin

Dipost 5 tahun yang lalu

Jawaban Terpilih

solve gan setelah saya googling ternyata coding nya cuman dikit

<pre> $('.del').click(function(){ $(this).closest('tr').remove(); }); </pre>

tq semua buat yang sudah meluangkan waktunya :)

avatar yogapermana
@yogapermana

39 Kontribusi 10 Poin

Dipost 5 tahun yang lalu

Login untuk ikut Jawaban