Публикация данных jQuery на сервере в формате JSON

Question

Я знаю, что этот вопрос задавался много раз на SO и на сайте datatables, но я не могу заставить его работать, используя предоставленные решения.

Я строю свой datatable на стороне клиента и теперь хочу опубликовать данные клиента моему контроллеру app api в формате json.

Клиентская сторона работает правильно, когда дело доходит до добавления/удаления строк. Но когда я пытаюсь создать свою JSON с помощью:

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

Я получаю следующий результат:

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

поэтому в основном я пропускаю имена столбцов в мой объект JSON, таким образом, веб-апи не в состоянии поднять его и преобразовать его в:

List<ReceiptEntryViewModel> ReceiptDetails 

Так как я могу получить DataTables для генерации JSON в следующем формате:

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

Answer 1

Если вы просто хотите, чтобы собрать имена столбцов и использовать их в качестве имен свойств в формате JSON, то вы можете создать массив имен столбцов таким образом:

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

Я использую text() для фильтрации из любого HTML. Тогда сделайте, как описано выше, но перебирать каждую строку вместо этого, и построить объект буквальным (JSON элемент) для каждой строки с помощью собранной fieldNames:

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. Также не должно быть необходимости слепо перестраивать массив заголовков, так как вы, разработчик, знаете имена обоих столбцов и то, что вы хотите, чтобы свойства были названы как заранее.

---

Обновление с решением, в котором оно закончилось. Конусов с построением JSON можно избежать, если сам dataTable подготовлен для использования JSON. Определить columns раздел:

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

И вставить новые строки в формате JSON/литералов:

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

Теперь

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

Вернется действительный JSON строку, которая может быть передана в serverscript.

демо ->http://jsfiddle.net/d07f6uvf/