Get drop down selected value from row in datatables when trigger button

Question

I've included the sample in jsFiddle.

My question is, how to get the row drop down selected value when trigger the "click" button at the same row.

This is my HTML:

<table id="table1">
<thead>
    <tr>
        <th>Item</th>
        <th>UOM</th>
        <th></th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>Item 1</td>
        <td>
            <select>
                <option></option>
                <option>BAG</option>
                <option>UNIT</option>
            </select>
        </td>
        <td>
            <button type="button" class="add">Click</button>
        </td>
    </tr>
    <tr>
        <td>Item 1</td>
        <td>
            <select>
                <option></option>
                <option>BAG</option>
                <option>UNIT</option>
            </select>
        </td>
        <td>
            <button type="button" class="add">Click</button>
        </td>
    </tr>
</tbody>

My JavaScript:

oTable = $("#table1").dataTable({
    "fnDrawCallback": function(oSetting){
        $(".add").click(function(){
            var data = oTable.row($(this).parents('tr') ).data();
            console.log(data);
        });
    }
});

Gyrocode.com · Accepted Answer · 2015-08-02 17:06:14Z

2

SOLUTION

I would use rowCallback to define a callback that gets executed when row is drawn.

Then you can query value of <select> element by $('select', row).val() as shown below:

'rowCallback': function(row, data, index){
    $('.add', row).click(function(){
        console.log($('select', row).val());
    });
}

DEMO

See this jsFiddle for code and demonstration.

edited Aug 2, 2015 at 17:06

answered Aug 2, 2015 at 16:52

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

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

2 Comments

Gyrocode.com Over a year ago

@Michael, sorry I've meant to recommend rowCallback instead of createdRow, it's better suited for this. I have updated my answer and demo.

Michael Ngooi Over a year ago

got it. thx! My ultimate goal is to get the values and $.post to server.

Collectives™ on Stack Overflow

Get drop down selected value from row in datatables when trigger button

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related