bootstrapTable 输入数据updateRow防止输入被清空

      找了半天,终于还是不会被清空了,网上搜出来是下面这样例子,实验后发现表格值是更新进去了,但是页面输入值被清空了。

     改进后如下:

1.页面 .bootstrapTable

  columns: [{
                ....,
{
     field: 'remarks',
     title: '备注',
     sortable: true,
     sortName: 'remarks',
	formatter:formInput
   }

 2.js方法

		// 拼接input receiveCount字段前端添加的,一定要有value,否则updateRow数据页面上会被清空
		function formInput(value, row, index) {
			return '<input type="text" autocomplete="off" name="remarks" onblur="changeData(' + index + ',this);" placeholder="可编辑数量" value="'
					+ (function () {
						return !row.remarks ? '' : row.remarks
					})()
					+ '">'
		}
    function changeData(index, obj) {
            var value = $(obj).val();
			var name = $(obj).attr('name');
            //通过 index 获取指定的行
            var row =  $('#deviceStateOrderDetail').bootstrapTable('getRowByIndex',index);//行的数据
            //将 input 的值存进 row 中
			row[name] = value;
            console.log(row);
            //更新指定的行,调用 'updateRow' 则会将 row 数据更新到 data 中,然后再重新加载
            $("#deviceStateOrderDetail").bootstrapTable('updateRow',{index: index, row: row});

        }

 3.大功告成

猜你喜欢

转载自blog.csdn.net/qq_33278354/article/details/108352040