動的データを使用したjQueryデータ型

Question

私はシンプルなメッセージングシステムを持っており、DBからjQuery/AJAXを使用してメッセージを取得してテーブルに追加しています。私はメッセージのページ番号を付けたかったので、DataTablesプラグイン（https://datatables.net/）を使用することにしました。

動的に生成されたデータでこれを使用する際に問題があります。私はまた、 "メッセージを削除する"などのメッセージを削除し、その後再びメッセージを取得する（テーブルをリフレッシュする）などの機能を持っています。 「DataTableを再初期化できません」というエラーが表示されます。

これは、これまでの私のコードです：

function getmessages(){ 
    $.ajax({ 
     type: "POST", 
     url: "modules/ajaxgetmessages.php", 
     dataType: 'json', 
     cache: false, 
     }) 
     .success(function(response) { 
      if(!response.errors && response.result) { 
       $("#tbodymessagelist").html(''); 
       $.each(response.result, function(index, value) { 
        var messagesubject = value[3]; 
        var messagecontent = value[4]; 
        var messagetime = value[5]; 
        var sendername = value[2]; 
        var readstatus = value[7]; 
        var messageid = value[8]; 
        if (readstatus==0){ 
         messageheader += '<tr><td><input type="checkbox" class="inboxcheckbox input-chk"></td><td class="sendername"><b>'+sendername+'</b></td><td class="messagesubject"><b>'+messagesubject+'</b></td><td><b>'+messagetime+'</b></td><td class="messageid" style="display:none">'+messageid+'</td><td class="readstatus" style="display:none">'+readstatus+'</td><td class="messagecontent" style="display:none"><b>'+messagecontent+'</b></td></tr>'; 
        } else { 
         messageheader += '<tr><td><input type="checkbox" class="inboxcheckbox input-chk"></td><td class="sendername">'+sendername+'</td><td class="messagesubject">'+messagesubject+'</td><td>'+messagetime+'</td><td class="messageid" style="display:none">'+messageid+'</td><td class="readstatus" style="display:none">'+readstatus+'</td><td class="messagecontent" style="display:none"><b>'+messagecontent+'</b></td></tr>';               
        } 
       }); 
       $("#tbodymessagelist").html(messageheader); 
       $('#tblinbox').DataTable({ 
        "paging": true, 
        "ordering": false, 
        "info":  false 
       }); 
      } else { 
       $.each(response.errors, function(index, value) { 
        $('input[name*='+index+']').addClass('error').after('<div class="errormessage">'+value+'</div>') 
       }); 
      } 
     });  
} 

それでは、どのように私は基本的に、メッセージの削除や他の機能の後に私のテーブルに変更を加えることができ、その後、テーブルを「リフレッシュ」？また、エントリがあるにもかかわらず、フッタにShowing 0 to 0 of 0 entriesが表示されます。

Answer 1

データテーブルを破棄して新しいインスタンスを作成する必要があります。

 
      ` 
      $('#tblinbox').DataTable.destroy(); 
      $('#tblinbox').empty();