Question

我使用jquery数据表，下面是代码。单击按钮时，数据已成功填充到数据表中。它没有任何问题。

  table = $('#customerMarkuptbl').DataTable({
            data: null,
            columns: [                           
                        { title: "CarrierID ", "data": "CarrierID", visible: false },
                        { title: "Carrier Service ID ", "data": "CarrierServiceID", visible: false },
                        { title: "Carrier ", "data": "CarrierName" },
                        { title: "Carrier Service", "data": "CarrierServiceName" },
                        {
                            title: "Markup ", "data": "MarkupValue",
                            render: function (data, type, row) {
                                return '<input class="form-control" id="Markup" name="Markup" type="text"  value = ' + row.MarkupValue + '  >';
                            }
                        },
            ]
        });

向表中添加了一个文本框列。然后用户更改文本框值，并将其作为json字符串发送到服务器。

var ObjMarkup = $('#customerMarkuptbl').DataTable().data().toArray();

问题是ObjMarkup不包含文本框的更改。它始终显示为0.（默认情况下，将数据检索到数据表时设置为0）

下面的示例包含样本行详细信息，它是“ObjMarkup”的结果。在下面的情况下，我更改了文本框的值，而不是分配给“ObjMarkup”变量。

例如：CarrierID：42 CarrierName：“测试运营商”CarrierServiceID：625 CarrierServiceName：“满载”MarkupValue：0

那么这个问题是什么？有什么解决方案吗？为什么不能将文本框值获取到数组？

Answer 1

我不太清楚我明白当“用户更改文本框值并将其作为json字符串发送到服务器”时会发生什么，但您无法检索<input>'的动态值s（不论类型）通过data()。 data()只返回原始值，没有内部逻辑，更改<input>也会更改基础数据集。

所以你必须自己做。以下示例检索<input>回调插入到第一列的render()的动态值，如上所述：

$('#example tbody').on('click', 'tr', function() {
  var $row = table.row(this).nodes().to$(),
      currentInputValue = $row.find('td:eq(0) input').val()
  console.log(currentInputValue)
})

演示 - ＆gt;的 http://jsfiddle.net/vp2j3mcd/

如上所述，我不太确定你要做什么，不能完全复制。但是你可以采用上面的代码和

var ObjMarkup = $('#customerMarkuptbl').DataTable().data().toArray(); ObjMarkup.MarkupValue = currentInputValue //...send (I guess)

Answer 2

这将得到值：

table.cell(rowIdx,colIndx).nodes().to$().find('input').val()

Answer 3

在“渲染”功能的输入中添加一个类。我将使用trackInput作为示例。

  table = $('#customerMarkuptbl').DataTable({
            data: null,
            columns: [                           
                        { title: "CarrierID ", "data": "CarrierID", visible: false },
                        { title: "Carrier Service ID ", "data": "CarrierServiceID", visible: false },
                        { title: "Carrier ", "data": "CarrierName" },
                        { title: "Carrier Service", "data": "CarrierServiceName" },
                        {
                            title: "Markup ", "data": "MarkupValue",
                            render: function (data, type, row) {
                                return '<input class="form-control trackInput" id="Markup" name="Markup" type="text"  value = ' + row.MarkupValue + '  >';
                            }
                        },
            ],
    "drawCallback": function( settings ) {
                  $(".trackInput").on("change",function(){
                       var $row = $(this).parents("tr");
                       var rowData = table.row($row).data();

                       rowData.MarkupValue = $(this).val();


                  })
            }
        });

现在

var ObjMarkup = $('#customerMarkuptbl').DataTable().data().toArray();

将提供正确的值。

Jquery数据表输入文本框到列

3 个答案: