bootstrap-table 单元格input 编辑后存值失败

1、使用insert Row增加row

$("#" + table.options.id).bootstrapTable('insertRow', {
index: length , // 你想插入到哪，0表示第一行
    row: {
primaryNumber:primaryNumber,
secondaryNumber:secondaryNumber,
bomName:sevenCode.name,
bomQuantity:'<input type="text" name="theSameQuantity" style=" 50px" value="'+bomQuantity+'"   oninput ="updateQuantity(this ,'+poType+')">',
erpOrderNo:erpOrderNo,
expectTime:expectTime,
assembleState:assembleState,
replyTime:replyTime,
unfinishedReason:unfinishedReason,
poType:poType,
primaryNumberSon:primaryNumber,
secondaryNumberSon:secondaryNumber,
needQuantity: '<input type="text" name="theSameQuantity" style=" 50px" value="'+bomQuantity+'"  oninput ="updateQuantity(this ,'+poType+')">',
name:sevenCode.name,
props:sevenCode.props,
unitOfMeasure:sevenCode.unitOfMeasure,
majorQuantity:bomQuantity
    }
});
// 下标新增
length++ ;

---- 在修改td  input中的值后　再次新增数据被刷新覆盖

解决方案　updateQuantity（）

$('#bootstrap-table').bootstrapTable('updateCell',{
index:index,
field:'needQuantity',
value:'<input type="text" name="theSameQuantity" style=" 50px" value="'+value+'"   oninput ="updateQuantity(this ,'+poType+')">'
});

对每个单元格重新赋值
在这里使用oninput 事件修改值后会有类似刷新的问题，建议使用onblur 解决这个问题。 
另外有种简便的写法如下：

{
field: 'bomQuantity',
title: '组立数量',
formatter:function (value, row , index) {
if(row.poType=='1'){
return '<input type="text" name="bomQuantity" value="'+value+'" style=" 50px" onblur="changeData('+ index +', this)" />';
       }else{
return value ;
       }
    }
},

function changeData(index, obj) {
var value = $(obj).val();
var name = $(obj).attr('name');
//通过 index 获取指定的行
    var row = $("#bootstrap-table").bootstrapTable('getOptions').data[index];
if( row.poType=='1'){
//将 input 的值存进 row 中
       row['bomQuantity'] = value;
row['needQuantity'] = value;
   }else{
//将 input 的值存进 row 中
       row[name] = value;
   }
//更新指定的行，调用 'updateRow' 则会将 row 数据更新到 data 中，然后再重新加载
    $("#bootstrap-table").bootstrapTable('updateRow',{index: index, row: row});
}

bootstrap-table 单元格input 编辑后存值失败

相关推荐