获取作为输入文本字段的Datatables单元格值 [英] Get Datatables cell value that is input text field

问题描述

我正在使用javascript数据源生成DataTable。 数据从ajax调用返回到nodejs，后者查询SQL Server数据库表并返回2列数字数据。我添加了2个列来保存输入字段，默认值为0，供用户输入将增加/减少ColumnA / B中的值的数字。

I'm generating a DataTable with a javascript data source. The data is returned from an ajax call to nodejs which queries SQL Server DB table and returns 2 columns, both numerical data. I'm adding 2 more columns to hold input fields, with default value of 0, for the user to enter numbers that will increase/decrease the values found in ColumnA/B.

$('#mytable').DataTable( {
    "data": data,
    "columns": [
        { "data": "ColumnA", "defaultContent": "NA" },
        { "data": "ColumnB", "defaultContent": "NA" },
        { "data": undefined, "defaultContent": '<input type="text" value="0" size="10"/>'},
        { "data": undefined, "defaultContent": '<input type="text" value="0" size="10"/>'}
    ]
});

这渲染得很好，我可以修改单元格输入字段中的文本。
表格外有一个单独的输入字段，用户可以点击提交更改，调用一个javascript函数来读取表格的输入字段。但是，我无法弄清楚如何获得它们。使用：

This renders just fine and I can modify the text in the input field in the cell. There is a separate input field outside the table that the user can click to 'submit changes', which calls a javascript function that will read those input fields of the table. However, I cannot figure out how to get them. Using:

var aTable = $('#mytable').DataTable();
var colAchange = atable.cell(0, 2).data();
var colBchange = atable.cell(0, 3).data();

两个colA / Bchange变量都只有'input type =text...'html文本，而不是输入字段的值。这确实有意义，但我找不到正确的方法来读取输入字段的值。
有一次我在Datatables文档中读过你可以将'meta'数据添加到行数据中。我是否需要这样做才能在该元素上获得id并通过该元素查询元素？否则我如何获得该输入的值？

Both colA/Bchange vars just have the 'input type="text" ...' html text, not the value of the input field. This does make sense, but I cannot find the right way to read the value of the input field. At one time I had read in the Datatables docs that you can add 'meta' data to the row data. Do I need to do that to get an "id" on that element and query the element by that? Otherwise how do I get that input's value?

推荐答案

如果您只想提取输入框中输入的值，那么必须通过jQuery或本机DOM。 dataTables本身不知道对表单输入字段所做的任何更改，因此尝试通过 cell（）。data（）检索值将永远不会有效，无论是否有 id 's / orthogonal data：

If you just want to extract the values entered in the input boxes, you must go through jQuery or native DOM. dataTables itself is not aware of any changes made to form input fields, so trying to retrieve the values by cell().data() will never work, with or without id's / orthogonal data :

aTable.cell(0,2).nodes().to$().find('input').val()
aTable.cell(0,3).nodes().to$().find('input').val()   

将为您提供各种输入的当前值。在这个小提琴中100％复制了你的上述场景 - > http://jsfiddle.net/obmghyo7/

Will give you the current value of the various inputs. Have replicated your above scenario 100% in this fiddle -> http://jsfiddle.net/obmghyo7/

这基本上也是官方文档建议从表单输入中提取值的方法 - > https://datatables.net/examples/api/form.html

This is basically also how the official documentation suggests a way to extract values from form inputs -> https://datatables.net/examples/api/form.html

如果你想在表格中执行过滤/搜索，其中还包括用户在表单输入中所做的更改，那么它有点棘手 - > JSQuery Datatables在输入中搜索并选择 （我的，但我不知道更好的答案）

If you want to perform filtering / searches within the table, which also includes changes made by the user in form inputs, then it is a little more tricky -> JQuery Datatables search within input and select (mine, but I dont know any better answer)

这篇关于获取作为输入文本字段的Datatables单元格值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！