Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Remove table row after clicking table row delete button

Solution can use jQuery or be plain JavaScript.

I want to remove a table row after user has clicked the corresponding button contained in the table row cell so for example:

<script> function SomeDeleteRowFunction() {  //no clue what to put here? } </script>  <table>    <tr>        <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction()"></td>    </tr>    <tr>        <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction()"></td>    </tr>    <tr>        <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction()"></td>    </tr> </table> 
like image 529
like-a-trainee Avatar asked Jul 19 '12 04:07

like-a-trainee


People also ask

How do I delete a row in click?

jQuery: Code to Remove Table Row (tr) on Button Click. Here, we make a jQuery click event on the button tag. Using the closest() method we select the current row ie closest tr of our delete button, and then with the remove() method will delete that record. Similarly for deleting the next row tr we use .

How do you get rid of a row in a table?

Delete a row or column Select a row or column that you want to delete. Press Backspace, or select the Table Tools Layout tab >Delete, and then select an option. Note: In Excel, select a row or column that you want to delete, right-click and select Delete , and choose the option you want.

How do I delete a row from a table in react?

Delete row from a table, deleteRow(id), remove() or use useState () in Reactjs.

How do you delete a row in HTML?

The Table deleteRow() method is used for removing a <tr> element from a table. In other words, Table deleteRow() method is used for deleting row(s) at the specified index in the table. index :It is used to specify the position of the row to be deleted.


1 Answers

You can use jQuery click instead of using onclick attribute, Try the following:

$('table').on('click', 'input[type="button"]', function(e){    $(this).closest('tr').remove() }) 

Demo

like image 98
undefined Avatar answered Sep 18 '22 11:09

undefined