Question

我正在使用带x-editabel插件的bootstrap-table。该表有3个字段，但只有一个是可编辑的。我需要向服务器脚本发送所有字段，而不仅仅是可编辑字段。我使用的代码如下：

$('#table-result').bootstrapTable({
 columns: [
    [{
       field: 'Network Domain',
       title: 'Network domain'
      }, {
       field: 'Service Provider',
       title: 'Service provider'
      }, {
       field: 'Category',
       title: 'Category',
       editable: {
         url: ajaxurl,
         ajaxOptions: {
           type: 'get',
           dataType: 'json'
         },
         success: function(response, newValue) {
          /* some code here */
         },
         type: 'select',
         title: 'Select category',
         placement: 'left',
         emptytext: 'empty text',
         source: [
            {value: 'cat1', text: 'cat1'},
            {value: 'cat2', text: 'cat2'}
         ]
      }],
});

这就是HTML

<table class="table table-striped table-bordered table-hover"
    id="table-result"
    data-height="800"
    data-page-list="[5, 10, 20, 50, 100, 200]"
    data-pagination="true"
    data-page-number="1"
    data-page-size="10"
    data-search="false"
    data-side-pagination="client"
    data-show-columns="true"
    data-show-export="true"
    data-sort-name="Category"
    data-sort-order="desc"
    data-toolbar="#toolbar"
    >
</table>

表数据来自ajax（没问题：它正在运行）。

我需要将所有字段（而不仅仅是类别字段）发送到ajax脚本，该脚本将对所选类别字段执行更改。我无法为每个表行定义和使用pk，因为当我单击可编辑字段时我需要执行的操作需要所有字段。我想使用x-editable的'params'选项，但我不知道如何告诉它我正在编辑的行的当前值。

你有什么建议吗？ TIA

P.S。很抱歉，如果我无法以“可理解的”形式解释问题，但英语不是我的主要语言。

Answer 1

确定。我解决了这个问题。

从editable：

中删除了ajax部分

{
  url: ajaxurl,
  ajaxOptions: {
  type: 'get',
  dataType: 'json'
},
success: function(response, newValue) {
   /* some code here */
},

并在代码中添加为事件：

$('#table-result').on('editable-save.bs.table', function(e, field, row, oldValue, $el){
    //row.oldCategory = oldValue;
    //console.log(row);
    $.ajax({
        data: {
            'action': 'update',
            'Network Domain': row["Network Domain"],
            'Service Provider': row["Service Provider"],
            'Category': row["Category"],
            'oldCategory': oldValue
        },
        dataType: 'json',
        url: '$ajax_action_url'
    }).done(function(response) {
        // If successful
       console.log(response);
    }).fail(function(jqXHR, textStatus, errorThrown) {
        // If fail
        console.log(textStatus + ': ' + errorThrown);
    });  
});

使用bootstrap-table可编辑插件

1 个答案: