如何将ajax结果数据传递给jquery数据表

时间:2014-08-14 12:42:06

标签: php jquery ajax datatable jquery-datatables

我想将ajax页面的结果数据传递给jquery datatable函数,请告诉我如何将结果传递给datatable函数的正确语法:

function getResultsMsr(action, msrDel) {
            if(action == 'search') {
            $.ajax({
                     url: 'getResult.php',
                       type: 'POST',
                       data: {
                             formName:'afscpMsr',
                            action:'search',
                            field_nm: document.getElementById('msrdet').value,
                             field_value:document.getElementById('srhmsr').value    
                         }
                      }).done(function(result_data){

                          var  data= result_data;
                          $('#example').dataTable( {
                            "processing": true,
                            "serverSide": true
                    });

                    });

显示数据和列名称的表是:

   <table id="example" class="display" cellspacing="0" width="100%" >
                    <thead>
                         <tr>
                           <th>Customer Name</th>
                           <th>Feature Order No</th>
                           <th>NCP Account Number</th>
                           <th>Mcn Code</th>
                           <th>Sales Person</th>
                          <!--  <th>Due Date</th> --> 
                           <th>Status</th>
                            <th>MSR Id</th>
                            <th>Action </th>

                        </tr>
                    </thead>
                 </table>

传递结果以在datatable中显示的Ajax页面,此结果为json格式:

  if($_POST['action'] == 'search')
  {
    $col_nm = $_POST['field_nm'];
    $srch_val = $_POST['field_value'];
     if($srch_val == 'Yes') {
         $srch_val = 'Y';
     } elseif ($srch_val == 'No'){
        $srch_val = 'N';
    }
    $result = $afscpMsrMod->getMsrDetails($col_nm, $srch_val,$page,$start);
    $totalCont = $afscpMsrMod->getTotalCountOfMsrDetails($col_nm, $srch_val);
    $totalCont= ceil($totalCont/10);
    $newarray = array(
        "draw"            => intval( ""),
        "recordsTotal"    => intval($totalCont ),
        "recordsFiltered" => intval( $totalCont ),
        "data"            => json_encode($result[0])
    );
    echo json_encode($newarray);

2 个答案:

答案 0 :(得分:0)

您是否尝试使用aaData属性:

您可以在此处找到有关数据表的各种数据源的信息:

JS array as datasource in datatables

Server side data processing

Ajax source

DOM zero configuration

 function getResultsMsr(action, msrDel) {
        if(action == 'search') {
        $.ajax({
                 url: 'getResult.php',
                   type: 'POST',
                   data: {
                         formName:'afscpMsr',
              function getResultsMsr(action, msrDel) {
        if(action == 'search') {
        $.ajax({
                 url: 'getResult.php',
                   type: 'POST',
                   data: {
                         formName:'afscpMsr',
                        action:'search',
                        field_nm: document.getElementById('msrdet').value,
                         field_value:document.getElementById('srhmsr').value    
                     }
                  }).done(function(result_data){

                      var  data= result_data;
                      $('#example').dataTable( {
                        "processing": true,
                        "serverSide": true,
                        "aaData":data
                });

                });          action:'search',
                        field_nm: document.getElementById('msrdet').value,
                         field_value:document.getElementById('srhmsr').value    
                     }
                  }).done(function(result_data){

                      var  data= result_data;
                      $('#example').dataTable( {
                        "processing": true,
                        "serverSide": true
                });

                });

答案 1 :(得分:0)

嘿,你可以这样使用


    var opts =
        {
            'ajax'    :
            {
                'url': 'serverSideTableProviderPage',
                'type': 'POST',
                'contentType': 'application/json; charset=utf-8',
                'data':function(data)
                 {
                       return data = JSON.stringify(data);
                 }
            },
            'pagingType': 'simple',
            [more options ...]
        }
    $('table').dataTable(opts);

了解更多信息visit