jQuery datatable输入文本框到列 [英] Jquery datatable input textbox to column

问题描述

我使用jquery数据表，下面是代码.单击按钮将数据成功填充到数据表中.没问题.

Im using jquery datatable and below is the code. It is filled data successfully to datatable when clicking button. there is no problem in it.

  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字符串发送到服务器.

It is added a textbox column to the table. Then the user change text box value and it sends as json string to the server.

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

问题是ObjMarkup不包含文本框的更改.始终显示为0.(将数据检索到数据表时，默认设置为0)

The issue is ObjMarkup doesnt contain changes of textboxes. It is always showing as 0. (Default it is set to 0 when retrieve data to datatable)

下面的示例包含示例行详细信息，这是"ObjMarkup"的结果.在以下情况下，我更改了文本框的值，并且未将其分配给"ObjMarkup"变量.

Below Example has sample row details which is outcome of "ObjMarkup". In below case I change the value of textbox and it not assign to the "ObjMarkup" variable.

例如:CarrierID:42 CarrierName:测试运营商" CarrierServiceID:625 CarrierServiceName:满载" MarkupValue:0

Eg: CarrierID:42 CarrierName:"Test carrier" CarrierServiceID:625 CarrierServiceName:"Full load" MarkupValue:0

那么这是什么问题呢?有什么解决办法吗?为什么无法将文本框值获取到数组?

So whats the problem in this? Is there any solution? Why cant get textbox value to array?

推荐答案

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

Add a class to your input in the Render function. I'll use trackInput for my example.

  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 datatable输入文本框到列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！