根据另一列填充 BootstrapTable x-editable select 框

Question

我有一个 BootstrapTable select 盒子。我知道您可以使用一个函数来填充 select 框中的值。我希望该函数根据第二列（称为 Text_example）的值更改它提供的数组。

因此在我的示例中，如果该行的 Text_example 为 1，则 select 框应包含以下数据：[{1:1}]。如果该行的 Text_example 是 2，select 框应包含以下数据：[{2:2}]

我认为我的问题是我不知道如何将行的数据传递给函数 get_values，因为我的方法似乎不起作用。

完整 Fiddle: http://jsfiddle.net/goxe6ehg/

var data = [{"Text_example": 1},{"Text_example": 2}];

function get_values(data) {
    if (data['Text_Example'] === 1) {
    return [{1:1}];
  }
  else {
    return [{2: 2}]
  }

}

$('#table').bootstrapTable({
  columns: [
   {
      field: 'Select_example',
      title: 'Select_example',
      editable: {
        type: 'select',
        source:  get_values($('#table').bootstrapTable('getData'))
      }
    },
    {
      field: 'Text_example',
      title: 'Text_example'
    }
  ],
  data: data
});

编辑：我过度简化了示例。我不需要 text_example 的静态字段，而是需要它是一个 select 框，其中 select_example 的值会根据用户在 [=] 中编辑的 select 的内容而变化20=].

已更新 JSFiddle：http://jsfiddle.net/4wwv18Lq/4/

Answer 1

您可以在 bootstraptable 上使用 oninit 处理程序library.And通过遍历数据对象添加可编辑项。

var data = [{"Text_example": 1},{"Text_example": 2}];

$('#table').on('editable-init.bs.table', function(e){
    var $els =  $('#table').find('.editable');
     $els.each(function(index,value){
            $(this).editable('option', 'source', data[index])
     });

});
$('#table').bootstrapTable({
  columns: [
   {
      field: 'Select_example',
      title: 'Select_example',
      editable: {
        type: 'select'
      }
    },
    {
      field: 'Text_example',
      title: 'Text_example'
    }
  ],
  data: data
});

JSfiddle link http://jsfiddle.net/km10z2xe/

根据另一列填充 BootstrapTable x-editable select 框

Populate BootstrapTable x-editable select box based on another column

javascript

jquery

bootstrap-table