Bootstrap表如何使用data-formatter中的输入框更改值

Question

我正在使用bootstrap表来显示我的数据。我在列上使用了数据格式化程序，如：

function inputFormatter(value, row){
    return '<input class="form-control data-input" value="' + value + '">';
}

我的引导列：

<th data-field="channel_sku" data-align="center" data-formatter="inputFormatter">Channel SKU</th>

现在，数据在该列的输入框中显示为值，如：

现在的问题是当我更改输入框中的文本时，该单元格的值不会改变。即当我使用ajax将数据发送到我的后端时，我会得到旧的数据。此外，输入框中的value属性不会更改为新值。

那么如何在文本输入上更改该单元格的值？

Answer 1

我最终也找到了解决方法。我在单击存储行索引和字段的表中捕获了事件，该变量是全局变量。

每次单击一个单元格时，这些全局变量的值将更改为该单元格的新值。

$('#sku-map-table').bootstrapTable({
    onClickCell: function (field, value, row, $element) {
        $rowIndex = $element.closest('tr').attr('data-index');
        $field = field;
    }
});

然后我使用data-input类捕获了输入框，并使用新值更新了该单元格的值。

$(document).on('change', '.data-input', function(event) {
    $new_val = $(this).val();
    $('#sku-map-table').bootstrapTable('updateCell', {index: $rowIndex, field: $field, value: $new_val});
});

总结是要更改输入框的值，必须单击相应的单元格，这就是我使用的内容。

Answer 2

我周一开始使用这个图书馆，我也很满意，对我们来说很难过，显然今天没有足够的信息或问题。

这里的问题是输入的值与 t.setOnClickListener(new View.OnClickListener() { int Counter = 0; @Override public void onClick(View v) { Toast.makeText(getApplicationContext(), R.string.hey, Toast.LENGTH_SHORT).show(); t.setBackgroundColor(getResources().getColor(R.color.colorPrimary)); c.setBackgroundColor(getResources().getColor(R.color.colorAccent)); p.setVisibility(View.VISIBLE); if (Counter >= 0) { Counter++; e.setText("you clicked Click me "+Counter +"number of times"); e.setTextSize(15); e.setTextColor(getResources().getColor(R.color.colorPrimary)); e.setSingleLine(); } 方法提取的输入的值不同，此方法获取符合符合您传递给表的列表的对象的属性的值{{首先构造表时的参数。当您更改输入的值时，表的数据对象保持不变，这就是您继续获取旧数据的原因，每次输入触发bootstrapTable('getData')事件时，您需要更新数据对象上的值，可以使用data方法实现，该方法接收手册中描述的以下参数。

  

index：行索引。   字段：字段名称。   value：新字段值。   要禁用表重新初始化，可以设置{reinit：false}

我今天想出了这个解决方法，因为我想在我的列上实现输入，这里是我的列属性：

onChange

这是输入在更改时触发的功能：

bootstrapTable('updateCell', params)

它工作正常，这是一个截图：

前言：Bootstrap Table有一个名为x-editable的甜扩展，用于管理可编辑单元格并自动更新表所基于的数据模型，您可以在此查看它的实现方式{ {3}}，以及它的外观：example

你想用它做什么取决于你，干杯。