以JSON格式将jquery数据表数据发布到服务器

我知道在SO和datatables网站上已经多次询问过这个问题,但我无法使用提供的解决方案来解决这个问题。

我正在客户端构建我的数据表,现在想要以json格式将客户端数据发布到我的wep api控制器。

在添加/删除行时,客户端正常工作。 但是当我尝试使用以下方法创建我的JSON:

var table = $('#detailTable').DataTable(); var details = JSON.stringify(table.rows().data().toArray()); 

我得到以下结果:

 [["11046","ABC","bis","123","123",15129]] 

所以基本上我在我的JSON对象中缺少列名,因此web api无法将其取出并将其转换为:

 List ReceiptDetails 

那么如何让数据表以下列格式生成JSON:

 [["ItemId":"11046","ItemCode":"ABC","ItemName":"bis","Price":"123","Quantity":"123","Total":15129]] 

如果您只想收集列名并将它们用作JSON中的属性名,那么您可以通过以下方式构建列名称数组:

 var fieldNames = [], json = [] table.settings().columns()[0].forEach(function(index) { fieldNames.push($(table.column(index).header()).text()) }) 

我正在使用text()过滤掉任何HTML。 然后执行上述操作,但迭代遍历每一行,并使用收集的fieldNames为每一行构造一个对象文字(JSON项):

 table.rows().data().toArray().forEach(function(row) { var item = {} row.forEach(function(content, index) { item[fieldNames[index]] = content }) json.push(item) }) 

现在您有了一个有效的JSON,您可以将其stringify并发送到服务器。

小样本演示 – > http://jsfiddle.net/5j9wgorj/

请注意,这只是一个例子。 如果您有更大的数据集,则应避免forEach并使用for -loops。 此外,不需要盲目地重建头名称数组,因为您(开发人员)知道列名称以及您希望事先命名属性的内容。


更新它最终的解决方案。 如果dataTable本身准备使用JSON,则可以避免构建JSON的扭曲。 定义columns部分:

 var table = $('#example').DataTable({ columns : [ { data : 'myField' } ] }) 

并插入新行作为JSON /文字:

 table.row.add({ myField: 'some value' }).draw() 

现在

 JSON.stringify( table.rows().data().toArray() ) 

将返回可以传递给serverscript的有效JSON字符串。

演示 – > http://jsfiddle.net/d07f6uvf/