dataTableでajax呼び出しの後にデータを追加する方法

Question

私はdataTable jqueryプラグインを使用しています。私のデータはajaxからのものです。以下に示すコード ajax呼び出しの後にテーブルを作成したいと思います。私のjavascriptの

$("#student_report_form_btn").on('click',function(){ 
      $("#student_report_detail_list").empty(); 
      if($("#student_report_form").valid()) 
      { 
       $.ajax({ 
        url:site + 'index.php/user_report', 
        type:"post", 
        dataType:"json", 
        data:sume data, 
        success:function(msg){ 
         if(msg.user_report_detail !='') 
         { 
          //dddd(msg);return false; 
          student_report_table = ''; 
          student_report_table += '<div class="table-responsive">'; 
          student_report_table += '<table class="table table-bordered report-table" id="report-table">'; 
            student_report_table +='<tr><th>Date</th><th>Intime</th><th>Outtime</th></tr>'; 
            $.each(msg.user_report_detail,function(k,v){ 
             student_report_table += '<tr><td>'+ v['date'] +'</td><td>'+ v['intime'] +'</td><td>'+ v['outtime'] +'</td></tr>'; 
            }); 
          student_report_table += '</table>'; 
          student_report_table += '</div>'; 
          $("#student_report_detail_list").append(student_report_table); 
         }else{ 
          $("#student_report_detail_list").append("<div class='alert alert-danger'>" + 
           "<button type='button' class='close' data-dismiss='alert' aria-label='Close'> <span aria-hidden='true'>&times;</span></button>" + 
           "<strong>Sorry!</strong> There are not records for this user." + 
           "</div>"); 
          setTimeout(function() { $('.alert').alert('close'); }, 2000); 
         } 
        } 
       }); 
      } 
     }); 

DataTableの私のhtmlファイル

$(document).ready(function(){ 
    $(".report-table").DataTable({ 
         "pagingType": "full_numbers" 
        }); 
}); 

では、ここでは動作しません。助けてください。

Answer 1

テーブルの作品を作成するためにあなたの方法であれば（データテーブルを作成するには、はるかに良い可能性がある）私が唯一の問題は、あなたが

は、以下の

$("#student_report_form_btn").on('click',function() 
{ 
    $("#student_report_detail_list").empty(); 
    if($("#student_report_form").valid()) 
    { 
     $.ajax({ 
      url:site + 'index.php/user_report', 
      type:"post", 
      dataType:"json", 
      data:sume data, 
      success:function(msg){ 
       if(msg.user_report_detail !='') 
       { 
        //dddd(msg);return false; 
        student_report_table = ''; 
        student_report_table += '<div class="table-responsive">'; 
        student_report_table += '<table class="table table-bordered report-table" id="report-table">'; 
          student_report_table +='<tr><th>Date</th><th>Intime</th><th>Outtime</th></tr>'; 
          $.each(msg.user_report_detail,function(k,v){ 
           student_report_table += '<tr><td>'+ v['date'] +'</td><td>'+ v['intime'] +'</td><td>'+ v['outtime'] +'</td></tr>'; 
          }); 
        student_report_table += '</table>'; 
        student_report_table += '</div>'; 
        $("#student_report_detail_list").append(student_report_table); 
        $("#student_report_detail_list .report-table").DataTable({ 
         "pagingType": "full_numbers" 
        }); 
       }else{ 
        $("#student_report_detail_list").append("<div class='alert alert-danger'>" + 
         "<button type='button' class='close' data-dismiss='alert' aria-label='Close'> <span aria-hidden='true'>&times;</span></button>" + 
         "<strong>Sorry!</strong> There are not records for this user." + 
         "</div>"); 
        setTimeout(function() { $('.alert').alert('close'); }, 2000); 
       } 
      } 
     }); 
    } 
});