在更改BoostrapTable X可编辑选择框时获取文本而不是值

Z时代
2024-01-10
分类：问答

我使用BootstrapTable和x-editable来构建包含选择联系人框的表。当用户选择一个新值时，我会提醒他们他们选择了什么。使用editable-save.bs.table，我可以获得与选择选项相关的值，但这对用户无意义。我想获取与该值关联的联系人姓名。怎样才能做到我这样做在更改BoostrapTable X可编辑选择框时获取文本而不是值

小提琴：http://jsfiddle.net/cdvtkndu/

var data = [{"Contact": 3}, {"Contact": 2}]; 
$(function() { 
    $('#table').bootstrapTable({ 
     columns: [{ 
      field: 'Contact', 
      title: 'Contact', 
      editable: { 
       type: 'select', 
       source: [ 
        {value: 4, text: 'Andrew'}, 
        {value: 2, text: 'John'}, 
        {value: 3, text: 'Liz'} 
       ] 
      } 
     }], 
     data: data 
    }); 
}); 
$('#table').on('editable-save.bs.table', function (e, field, row, old, $el) { 
    var new_val = row[field]; 
    alert(new_val); 
});

回答：

你可以转储源到一个数组，然后遍历槽它，以便找到您要搜索的行：

var data = [{"Contact": 3}, {"Contact": 2}]; 
var _source = [ 
        {value: 4, text: 'Andrew'}, 
        {value: 2, text: 'John'}, 
        {value: 3, text: 'Liz'} 
       ]; 
$(function() { 
    $('#table').bootstrapTable({ 
     columns: [{ 
      field: 'Contact', 
      title: 'Contact', 
      editable: { 
       type: 'select', 
       source: _source 
      } 
     }], 
     data: data 
    }); 
}); 
$('#table').on('editable-save.bs.table', function (e, field, row, old, $el) { 
    var new_val = row[field]; 
    var arrayLength = _source.length; 
    for (var i = 0; i < arrayLength; i++) { 
     if (_source[i].value == new_val) { 
       alert(_source[i].text); 
      break; 
     } 
    }  
});