JQuery Datatables возвращает дополнительную информацию с сервера

используя JQuery Datatables, и все идет хорошо.

Я разработал способ отправки дополнительной информации от клиента на сервер. Теперь я хочу вернуться в другую сторону.

Итак, как мне отправить дополнительную информацию с сервера клиенту. Я бы подумал, что могу добавить дополнительную запись в возвращенный JSON и вытащить его где-нибудь. Один элемент, который я, возможно, хотел бы отправить назад, - это время, которое сервер взял для обработки ответа. Затем я могу показать эту информацию пользователю.

Любая помощь будет высоко оценена. Благодаря

Ответ 1

Думаю, у тебя все в порядке. Вам просто нужно подключить дополнительную сторону сервера данных в объекте JSON, а затем получить его в "fnServerData". Вы можете добавить этот код к объекту инициализации:

        "fnServerData": function ( sSource, aoData, fnCallback ) {
            $.getJSON( sSource, aoData, function (json) {
//Here you can do whatever you want with the additional data
                console.dir(json);
//Call the standard callback to redraw the table
                fnCallback(json);
            } );
        }

На стороне сервера вы можете добавить столько параметров, сколько хотите: обычно у вас есть json с 3 параметрами "iTotalRecords" (общее количество строк), "iTotalDisplayRecords" (общее количество фильтров, если вы используете фильтры) и aaData (ассоциативный массив со строками). Если вы добавляете, например, "iProcessingTime" (время, затраченное на обработку серверной части), вы можете сделать:

        "fnServerData": function ( sSource, aoData, fnCallback ) {
            $.getJSON( sSource, aoData, function (json) {
//take the processing time and put it in a div
                $('#processingTime').html(json.iProcessingTime);
//pass the data to the standard callback and draw the table
                fnCallback(json);
            } );
        }

Это то, что вам нужно?

Ответ 2

Также можно получить доступ к информации из файла JSON с помощью функции "fnInitComplete", которая вызывается после завершения события draw из таблицы (включая datarows).

  $('#example').dataTable( {
    "fnInitComplete": function(oSettings, json) {
      //Do something with json variable
    }
  });

Ответ 3

@Никола Пелухетти отвечает правильно. Но если вы следуете этому примеру http://datatables.net/release-datatables/examples/server_side/post.html и не хотите (по какой-то причине) хотеть использовать getJSON, это тоже работает

        "fnServerData": function ( sSource, aoData, fnCallback ) {
            $.ajax({
                "dataType": 'json',
                "type": "POST",
                "url": sSource,
                "data": aoData,
                "success": function(json){
                    $('#processingTime').html(json.iProcessingTime); // iProcessingTime is the variable that we added in JSON at the server side
                    fnCallback(json);
                }
            });               
        }

Ответ 4

Вышеуказанные предложения не помогли.

У меня есть реализация на сервере на стороне сервера, на странице. Поскольку пользователь вводит новые слова поиска, он должен обновляться, поэтому использование "fnInitComplete" не является опцией, поскольку оно запускается только один раз, когда объект DataTable инициализируется.

Переопределение fnServerData тоже не работает.

Итак, вместо этого я закончил его реализацию, захватив iProcessingTime из JSON через dataSrc:

var table = $('#pkgTable').DataTable({
    "processing" : true,
      "serverSide" : true,
      "sPaginationType" : "jPaginator",
      "ajax": {
          "url" : urlStr,
          "type" : "POST",
          "dataSrc": function(json) {
            var iProcessingTimeMS = json.iProcessingTime;
            var iProcessingTimeS = iProcessingTimeMS/1000;
            $("#processingTime").html("Search Time: " + iProcessingTimeMS + " ms. " + iProcessingTimeS + " s.");
          return json.aaData;
        }
      },
      "oLanguage": {
            "sProcessing":   "<span style='color: red; font-weight: bold'>Please Wait...</span>",
            "sZeroRecords":  "No Records Found...",
            "sSearch":       "Search All:",
            "sUrl":          "",
            "oPaginate": {
                             "sFirst"    : "<b>&lt;&lt;</b>",
                             "sLast"     : "<b>&gt;&gt;</b>",
                             "sPrevious" : "<b>&lt;</b>",
                             "sNext"     : "<b>&gt;</b>"
                    },
            "sLengthMenu": 'Display <select>' +
                    '<option value="10">10</option>' +
                    '<option value="20">20</option>' +
                    '<option value="50">50</option>' +
                    '<option value="100">100</option>' +
                    '</select> records'
        }
});

Ответ 5

"fnDrawCallback": function( oSettings ) {
    console.log(oSettings.json);//do whatever with your custom response
  },

Ответ 6

<div id="category"></div>

$('#example').dataTable( {
    "fnInitComplete": function(oSettings, json) {
      $('#category').html(json.category);
    }
  });

Кажется, это работает отлично для меня.