簡體   English   中英

如何在服務器端處理模式下將表單數據與jQuery DataTables數據一起發送

[英]How to send form data along with jQuery DataTables data in server-side processing mode

我試圖發布表單數據但沒有成功,無法加載數據。

如何將包含數組和單個文本框,組合框等的所有表單數據傳遞給fnServerdata

table_obj = $('#group-table').dataTable({
   "sAjaxSource": "URL Goes here",
   fnServerData: function(sSource, aoData, fnCallback,oSettings) {
      oSettings.jqXHR = $.ajax( {
         "dataType": 'json',
         "type": "POST",
         "url": sSource+'?'+$.param(aoData),
         "data": $("#frm").serializeArray(),
         "success": fnCallback
      } );
   },
   aaSorting: [[ 1, "desc" ]],
   bProcessing: true,
   bServerSide: true,
   processing : true,
   columnDefs: [{
        'targets': 0,
        'searchable':false,
        'orderable':false,
        'className': 'dt-body-center',
        'render': function (data, type, full, meta){
            return '<label><input type="checkbox" name="user_id[]" value="' + $('<div/>').text(data).html() + '"></label>';
        }
     }],
   rowCallback: function(row, data, dataIndex){
       // If row ID is in list of selected row IDs
       if($.inArray(data[0], rows_selected) !== -1){
          $(row).find('input[type="checkbox"]').prop('checked', true);
          $(row).addClass('selected');
       }
   },
   iDisplayLength: '50',
});

如果要格式化POST數據,還可以使用jquery .each()函數格式化表單數據。 讓我使用上面的答案使用解決方案#1,但使用jquery .each()來格式化數據。

$('table').DataTable({
  "ajax": {
     "url": "URL HERE",
     "type": "POST",
     "data": function(d) {
       var frm_data = $('form').serializeArray();
       $.each(frm_data, function(key, val) {
         d[val.name] = val.value;
       });
     }
  }
});

然后你可以在PHP中訪問它,如:

var $data = $_POST['name'];

解決方案1

替換這個:

$('#group-table').dataTable({
   "sAjaxSource": "URL Goes here",
   fnServerData: function(sSource, aoData, fnCallback,oSettings) {
      oSettings.jqXHR = $.ajax( {
         "dataType": 'json',
         "type": "POST",
         "url": sSource+'?'+$.param(aoData),
         "data": $("#frm").serializeArray(),
         "success": fnCallback
      } );
   },

有:

$('#group-table').dataTable({
   "ajax": {
      "url": "URL Goes here",
      "type": "POST",
      "data": function(d){
         d.form = $("#frm").serializeArray();
      }
   },

您的表單數據將在form參數中作為具有參數namevalue的對象數組,下面是JSON表示:

"form": [{"name":"param1","value":"val1"},{"name":"param2","value":"val2"}]

解決方案2

如果您希望將表單數據作為名稱/值對,請參閱此jsFiddle以獲取替代解決方案的示例。


筆記

數據表中有復選框。 上面的解決方案不適用於數據表中的表單元素,因為DataTable從DOM中刪除了不可見的節點。

這個怎么樣?

$('#group-table').DataTable( {
          "processing": true,
          "serverSide": true,
          "bDestroy": true,
          "bJQueryUI": true,
          "ajax": {
              "url": "url here",
              "type": "POST",
              "data": {
                   store: $('#store').val(),
                   month: $('#m').val(),
                   year: $('#y').val(),
                   status: $('#status').val(),
                },
          }
    } );

然后你可以使用這個通過PHP訪問上面的示例數據。

$_POST['store']
$_POST['month']
$_POST['year']
$_POST['status]

希望有所幫助。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM