触发按钮时从数据表中的行中获取下拉选定值

Question

我已将示例包含在 jsFiddle 中。

我的问题是，当在同一行触发 "click" 按钮时，如何让行下拉选中的值。

这是我的 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>

我的JavaScript:

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

Answer 1

解决方案

我会使用 rowCallback 来定义绘制行时执行的回调。

然后可以通过$('select', row).val()查询<select>元素的值，如下图：

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

演示

有关代码和演示，请参阅 this jsFiddle。

触发按钮时从数据表中的行中获取下拉选定值

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

javascript

datatables

datatables-1.10