需求:bootstrap
在bootstrap table上增長輸入框,須要選擇的時候把輸入的值保存到 row 裏面,傳遞給其餘模塊使用。this
實現:spa
columns: [{ ...., { field: 'myField', //自定義字段名稱 title: '輸入值', //自定義 width: '5%', formatter: function (value, row , index) { return '<input type="text" name="myField" value="" onblur="changeData('+ index +', this);" />'; } }]
在columns 裏面增長自定義一個節點,而後使用 formatter 轉換成輸入框,並綁定 onblur 事件。code
function changeData(index, obj) {
var value = $(obj).val();
var name = $(obj).attr('name');
//經過 index 獲取指定的行
var row = $("#table").bootstrapTable('getOptions').data[index];
//將 input 的值存進 row 中
row[name] = value;
//更新指定的行,調用 'updateRow' 則會將 row 數據更新到 data 中,而後再從新加載
$("#table").bootstrapTable('updateRow',{index: index, row: row});
}
而後就能夠從 row 中取得輸入的值了。orm
function getSelections() {
return $.map($("#table").bootstrapTable('getSelections'), function (row) {
return row
});
}
演示:blog
輸入:事件
輸出:get