Dynamic jquery selector based on html attribute

Question

I have the following code:

<table id="Product">
       <thead>
              <tr>
                    <th>ProductId</th>
                    <th>Productname</th>
                    <th>Quantity</th>
                    <th>UnitPrice</th>
              </tr>
       </thead>
       <tbody>

       </tbody>
</table>

<button id="add" data-table="Product" data-url="Product/Add"></button>

Then in javascript file:

     $('#add').click(function () {
            var url = $(this).attr("data-url");
            var table = $(this).attr("data-table");
            var tableBody = ???; 
            //some logic with tablebody

    });

How can i get table body of the table?

var tableBody = $("table tbody") or var tableBody = $("#" + table) What is expected result? — guest271314
– guest271314, Commented Apr 15, 2016 at 0:33
var tableBody = $("#"+table+" tbody"); this woks, $("table tbody") this pick any (or first) table tag... thanks — Rieth
– Rieth, Commented Apr 15, 2016 at 0:40

ericbn · Accepted Answer · 2016-04-15 00:41:13Z

2

$('#add').click(function () {
    var $this = $(this);
    var url = $this.data("url");
    var tableId = $this.data("table");
    var $tableBody = $("#" + tableId + " tbody");
});

Read more about jQuery selectors at https://api.jquery.com/category/selectors/

Here I'm using the ID Selector and the Descendant Selector.

edited Apr 15, 2016 at 0:41

answered Apr 15, 2016 at 0:35

ericbn

11.2k7 gold badges53 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Juan Pablo Baltra · Accepted Answer · 2016-04-15 00:38:50Z

1

 $('#add').click(function () {
        var url = $(this).attr("data-url");
        var table = $(this).attr("data-table");
        var tableBody = $("#" + table).find("tbody"); 
        //some logic with tablebody

});

answered Apr 15, 2016 at 0:38

Juan Pablo Baltra

234 bronze badges

1 Comment

Rieth Over a year ago

thanks, this also work var tableBody = $("#"+table+" tbody");

Collectives™ on Stack Overflow

Dynamic jquery selector based on html attribute

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related