단추를 통해 DataTable 데이터로드 Click

Question

단추 클릭을 통해 DataTable을 채우고 싶습니다. 처음에 데이터 테이블이 비어 있어야합니다 :

var searchText = $("#textBox").val(); 

    Table = $("#customerTable").dataTable({ 
     data:[], 
     "columns": [ 
        {"data": "Id" }, 
        { "data": "Name" }, 
        { "data": "City" }, 
        { "data": "Country" } 
     ]   
     //"serverSide": true 
    }); 

하고 버튼 클릭 :

$("#SearchButton").on("click", function (event) { 

$.ajax({ 
      url: "/LoadCustomers", 
      type: "post" 
     }); 
Table.rows.add(result).draw(); 
}); 

Answer 1

를 해결을!

Table = $("#customerTable").DataTable({ 
    data:[], 
    columns: [ 
       { "data": "CompanyId" }, 
       { "data": "CompanyName" }, 
       { "data": "City" }, 
       { "data": "Country" } 
    ], 
    rowCallback: function (row, data) {}, 
    filter: false, 
    info: false, 
    ordering: false, 
    processing: true, 
    retrieve: true   
}); 

버튼을 클릭 처리기 :

내 표는 다음과 같습니다

$("#customerSearchButton").on("click", function (event) { 
    $.ajax({ 
      url: "", 
      type: "post", 
      data: { searchText: searchText } 
     }).done(function (result) { 
      Table.clear().draw(); 
      Table.rows.add(result).draw(); 
      }).fail(function (jqXHR, textStatus, errorThrown) { 
        // needs to implement if it fails 
      }); 
} 

Answer 2

$(document).ready(function() { 
 
      Table = $("#datatable").DataTable({ 
 
      data:[], 
 
      columns: [ 
 
       { data: "IAVDate" }, 
 
       { data: "ShiftID" }, 
 
       { data: "UserID" }, 
 
       { data: "IAV" }, 
 
       { data: "Type" }, 
 
       { data: "IAV Value"} 
 
      ], 
 
      rowCallback: function (row, data) {}, 
 
       filter: false, 
 
       info: false, 
 
       ordering: false, 
 
       processing: true, 
 
       retrieve: true 
 
      }); 
 

 
      
 
     start = jQuery("#start").val(); 
 
     end = jQuery("#end").val(); 
 
      $("#generate").on("click", function (event) { 
 
      alert('result'); 
 
        $.ajax({ 
 
         url: "<?php echo base_url(); ?>Report/IAV_sale", 
 
         type: "post", 
 
        "data": {"start":start,"end":end}, 
 
        }).done(function (result) { 
 

 
         Table.clear().draw(); 
 
         Table.rows.add(result).draw(); 
 
         }).fail(function (jqXHR, textStatus, errorThrown) { 
 
          // needs to implement if it fails 
 
        }); 
 
        });  
 
});

이봐, 나는 위가 내 데이터 테이블을 업데이트하지 않았다 코드,

내 대답 { "data": [{ "IAVDate": "2017-03-17 07:08:32", "ShiftID": "30", "UserID": "111", "IAV": "45248022418 ","유형 ":"현금 ","IAV 값 ":"1400 "}, {"IAVDate ":"2017-03-17 07:09:49 ","ShiftID ":"30 ","UserID " "111", "IAV": "63094881690", "유형": "현금", "IAV 값": "20"}, { "IAVDate": "2017-03-17 07:12:14", "ShiftID ":"30 ","UserID ":"111 ","IAV ":"55841613411 ","유형 ":"카드 ","IAV 값 ":"0 "}, {"IAVDate ":"2017-03- IAV 값 : "0"}, "17", "ShiftID": "30", "UserID": "111", "IAV": "27197239869" { "IAVDate": "2017-03-17 07:19:43", "ShiftID": "30", "UserID": "111", "IAV": "82469287727", "유형": "현금", "IAV Value": "10"}, { "IAVDate": "2017-03-17 07:20:33", "ShiftID": "30", "UserID": "111", "IAV": "22158170425 ","유형 ":"현금 ","IAV 값 ":"200 "}, {"IAVDate ":"2017-03-17 07:20:44 ","ShiftID ":"30 ","UserID " "111", "IAV": "91852461457", "유형": "현금", "IAV 값": "50"}, { "IAVDate": "2017-03-17 07:20:50", "ShiftID ","30 ","UserID ":"111 ","IAV ":"3906686807 ","유형 ":"현금 ","IAV 값 ":"20 "}, {"IAVDate " : "2017-03-17 07:20:52", "ShiftID": "30", "UserID": "111", "IAV": "28281616952", "유형": "현금", "IAV 값" : "200"}, { "IAVDate": "2017-03-17 07:22:18", "ShiftID": "30", "UserID": "111", "IAV": "20432041716", "유형 ","IAV Value ":"100 "}, {"IAVDate ":"2017-03-17 07:22:21 ","ShiftID ":"30 ","UserID ":"111 " "IAV": "43137123170", "유형": "현금", "IAV 값": "50"}, { "IAVDate": "2017-03-17 07:22:26", "ShiftID": "30 ","사용자 ID ":"111 ","IAV ":"99290115936 ","유형 ":"현금 ","IAV 값 ":"5 "}, {"IAVDate ":"2017-03-17 07:23 "IAV Value": "700"}, { "IAVDate": "14", "ShiftID": "30", "UserID": "111", "IAV": "69687310655" : "2017-03-17 07:24:21", "ShiftID": "30", "UserID": "111", "IAV": "5706858910", "유형": "카드", "IAV 값" : "700"}, { "IAVDate": "2017-03-17 07:25:44", "ShiftID": "30", "UserID": "111", "IAV": "25842193589", "유형 ":"현금 ","IAV 값 ":"47 "}]}