编辑bootstrap-table中的行

时间:2016-10-11 10:29:22

标签: javascript jquery twitter-bootstrap bootstrap-table

我在JSP页面中使用了boostrap-table

<table id="mytable" 
   data-row-style="rowStyle" class="table table-hover" id="table-pagination " 
   data-url="lots.json" 
   data-toggle="table"
   data-pagination="true"
   data-show-pagination-switch="true"
   data-sort-order="desc" 
   data-search="true"
   data-show-refresh="true" 
   data-show-columns="true"

   data-page-list="[10, 25, 50, 100, ALL]"                     
>

    <thead>
        <tr>
            <th data-field="machine" data-align="center" data-sortable="true">machine</th>
            <th data-field="mould" data-align="center" data-sortable="true">mould</th>
            <th data-field="lot" data-editable="true" data-align="center" data-sortable="true">LOT</th>         

        </tr>
    </thead>
</table>

我已经在我的第3列插入了editable method,它在前端工作。

我尝试捕获我在表格中插入的新值(例如,我编辑一行并插入'12'):我试过这个:

$(function() {
    $('#mytable').on('editable-save.bs.table', function(field, row, oldValue, $el){
        console.log("1 "+ field);
        console.log("2 "+ row);
        console.log("3 "+ oldValue);
        console.log("4 "+ $el);
    });    
});

但在控制台我得到:

1 [object Object]
2 lot
3 [object Object]
4 002400000 // this is the old one

1 个答案:

答案 0 :(得分:0)

$(function() {
    $('#mytable').on('editable-save.bs.table', function(e, field, row, oldValue){
        console.log("1 "+ field);
        console.log("2 "+ row[field]);
        console.log("3 "+ row.lot);
        console.log("4 "+ oldValue);
    });    
});

在这里您可以使用row [field]或row.lot

获取新值