bootstrap table 列表增长输入框并保存输入的值不清除

需求: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

相关文章
相关标签/搜索