CODEWITHSUNDEEP
javascriptjqueryhtml
Varia
Varia

Reputation: 167

How to remove row based on clicking on a separate div in Jquery/Javascript?

I want to know the best way to accomplish the following.

I have a table:

<table>
<tr><td>1</td><td>Some1</td></tr>
<tr><td>2</td><td>Some2</td></tr>
<tr><td>3</td><td>Some3</td></tr>
</table>

When I click on a TD (1,2,or 3), then a div is visible with id "#removediv" that has some basic text like "Remove". I click on the div, and the row that I had originally clicked on to get the div to show, is removed.

I imagine I would have to pass some information about the row or index to the "#removediv" object so that #removediv event handler would know which row to remove. Not sure how to best go about doing this.

Upvotes: 0

Views: 105

Answers (1)

Mike Thomsen
Mike Thomsen

Reputation: 37506

var remove = null;
var caller = null;

$(function() {
    remove = $('#removediv');
    $('td').click(function() {
        caller = $(this).parent('tr');
        remove.show();
    });
    remove.click(function() {
        caller.remove();
        $(this).hide();
    });
});

Upvotes: 1

Related Questions