Home/ Questions/Q 6828929
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T22:26:27+00:00

I have a list of items, which I will be presenting to the user

  • 0

I have a list of items, which I will be presenting to the user as table rows.

Each row will have a small ‘x’ image in the top right hand corner, which when clicked will cause the following behaviour:

  • Prompt the user (Yes/Cancel) if they want to delete the row
  • If user clicks cancel nothing happens, if yes, then delete the row and update the table.

The html looks something like this:

<html>
    <head>
        <script type="text/javascript" src = jquery.js"></script>
    </head>
    <body>
       <table><tbody>
          <tr>
             <td><div class="delbtn"></div>
                 <div class="rowitem">This one line item</div>
          </tr>
          <tr>
             <td><div class="delbtn"></div>
                 <div class="rowitem">This another line item</div>
          </tr>
          <tr>
             <td><div class="delbtn"></div>
                 <div class="rowitem">blah, blah, blah</div>
          </tr>
          </tbody>
       </table>
       <script type="text/javascript">
           $().ready(function(){
               // What to do ?
            });
       </script>
    </body>
</html>

Clearly, I have to bind to the div.delbtn pattern, but how do I know the row that was clicked on, and how do I delete that row from the table?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
    $().ready(function() {
   $('.delbtn').click(function() {
       $(this).parent('tr').remove();
   });
});

    No need to “know” which row was clicked on, as each DOM node is aware of who its parent node is, and can eaisly move back up the DOM tree using .parent(), to look for a particular ancestor. In this case, you want to nuke a row, so look for an ancestor <tr> of which ever node the click occured in.

    • 0