2017-07-26 6 views
0

からのデータを使用してテーブルをロードするために取得できません:は、DataTableのは、私は私のサーバーからJSON情報を取得するために、AJAX呼び出しを使用してJSON

console.log('GOT IT'); 
/* attach a submit handler to the form */ 
$('#search-form').submit(function(event) { 

    /* stop form from submitting normally */ 
    event.preventDefault(); 

    /* get the action attribute from the <form action=''> element */ 
    var form = $(this), 
    url = form.attr('action'); 


    var data = $('form#search-form').serialize() 

    /* Send the data using post with element id name and name2*/ 
    var posting = $.post(url, data, datype = 'json'); 

    /* Alerts the results */ 
    posting.done(function(data) { 
    $('#results-table').dataTable({ 
     ajax: data 
    }); 
    }); 
}); 

データ自体は、この形式では私のサーバーからJSON文字列のリターンです:

{ 
    "success":true, 
    "result":[{"salutationtype":"Ms.","firstname":"Jennifer","contact_no":"CON1","phone":"","lastname":"Gale" 
} 

私は「結果」にdataSrcを変更する必要があるかもしれませんが、それが機能しなかったと思いました。私はまた、$.jsonParse()JSON.parse()のJSONを解析し、それをJSON文字列ではなくオブジェクトとしてdataTablesに送っていましたが、どちらもうまくいきませんでした。

+0

あなたは 'data' varで応答を得ますか? –

+0

data.resultでデータを変更しようとします – gaetanoM

+0

これを試してください。 '$( '#結果-テーブル')のdataTable({ aaData:データ });' –

答えて

0

下記の解決策を試してください。これは単なる例です。

$('#results-table').dataTable({ 
         "bFilter": false, 
         "bRetrieve": false, 
         "bSortClasses": false, 
         "bLengthChange": true, 
         "bPaginate": true, 
         "bAutoWidth": true, 
         "aaSorting": [], 
         "aaData": data, 
         pagingType: "full_numbers", 
         scrollCollapse: false, 
         "sScrollX": true, 
         "autoWidth": true, 
         bAutoWidth: false, 
         responsive: true, 
         stateSave: true, 
         sDom: 'R<"data-table-wrapper"rt><"bottomside"ilp>', 
         "drawCallback": function(settings) { 
         }, 
         "aoColumns": [ 
          { 
           "sTitle": '<input type="checkbox" class="radio_select hathi">', 
           "mData": null, 
           "bSortable": false, 
           "render": function(obj) { 
            return '<input name="outcomes_chk" id="checkbox_class" type="checkbox" value="' + obj.id + '" class="radio_select madaniyu ">' 
           } 
          }, 
          { 
           "sTitle": "Name", 
           "mData": null, 
           "render": function(obj) { 
            return '<input type="text" data-name="name[]" class="required form-control input-sm font-body-size readonly transparent edit no-border" value="' + obj.name + '" >' 
           } 

          } 
         ] 
        }); 

aoColumnsに入力してください。

0

は、私はあなたがあなたの次の行を変更をお勧めします

var data = $('form#search-form').serialize() 

var formdata = $('form#search-form').serialize(); 
/* Send the data using post with element id name and name2*/ 
var posting = $.post(url, formdata, datype = 'json'); 

にあなたの変数名はデータであり、あなたのparamの名前もデータであり、 不足しているセミコロンが同じでありライン;

関連する問題