bootstrap table实现x-editable的行单元格编辑及解决数据Empty的问题

最近在研究 bootstrapTable-editable , 在编辑时出现了一些问题, 比如在行编辑时select的数据回显, 代码如下

$('#labelName').bootstrapTable({
  pagination : false,//是否分页	
      columns: [
	{
	  field: 'label',
	  title: '标签名称'
	},
	{
	  field: 'key',
	  title: '主键选择',
	  editable: {
              type: 'select',
              title: '主键选择',
              mode: "inline",
              width: 150,
              source: function(row){
                  var result = [];
                  var getData = $('#labelName').bootstrapTable('getData'),
                      index = $(this).parents('tr').data('index');
                      console.log(getData[index].label)
                  $.ajax({
                      url:aicKnowledge + 'update/getProperties',
                      async: false,
                      type: "get",
                      data: {
                        id:jumpId,
                        label:getData[index].label
                      },
                      success: function (datas, status) {
                         if(datas.code == 600){
                            var items = datas.data;
			   $.each(items, function (key,value) {
	                        result.push({ value:value, text:value });
	                     });
                          }
                      }
                   });
                   return result;
              },
              noeditFormatter: function (value, row, index) { // 解决展示为empty的问题
                   var process={filed:"key",value:value};
                   return ['<a href="javascript:void(0)" rel="external nofollow" rel="external nofollow" rel="external nofollow" ',
                      ' data-name="'+process.filed+'"',
                        ' data-pk="1"',
                        ' data-value="' + process.value + '"',
                        '>' + process.value + '</a>'
                       ].join('');;
                    }
                } 
	}
  ],
}

  

posted @ 2020-07-14 10:13  甜甜宝宝  阅读(1418)  评论(0编辑  收藏  举报