使用来自AJAX调用的php更新DataTable

时间:2014-05-02 21:17:57

标签: javascript jquery datatables

我正在使用这个例子 - > http://datatables.net/examples/api/add_row.html

在我的情况下,我发送一个ajax调用到一个收集参数数组的PHP脚本。然后我接受这些参数并尝试动态地(并且可见地)在DataTable中插入新行

在该行:t.row.add( [我收到一个错误:“无法读取属性'添加'未定义”

有人可以帮忙吗?

<script>

    var asInitVals = new Array();
var oTable = $('.datatable-add-row table').dataTable({
    "bJQueryUI": false,
    "bAutoWidth": false,
    "sPaginationType": "full_numbers",
    "sDom": '<"datatable-header"fl><"datatable-scroll"t><"datatable-footer"ip>',
    "aaSorting":[[0,'desc']],
    "oLanguage": {
        "sSearch": "<span>Filter all:</span> _INPUT_",
        "sLengthMenu": "<span>Show entries:</span> _MENU_",
        "oPaginate": { "sFirst": "First", "sLast": "Last", "sNext": ">", "sPrevious": "<" }
    }
     });

     $(".dataTables_wrapper tfoot input").keyup( function () {
          oTable.fnFilter( this.value, $(".dataTables_wrapper tfoot input").index(this) );
      });

     (function newjobs() {
     var t = $('.datatable-add-row table').dataTable();
         var inputjob = $.ajax({
    type: "POST",
            url: "create_new_job.php",
    cache:false,
    success: function(data) {
        $('#invisible_button').on( 'click', function () {
            t.row.add( [
            data[0],
            data[1],
            data[2],
            data[3],
            data[4],
            data[6],
            data[7],
            data[8]             
            ] ).draw();
        } );
        $('#invisible_button').click();
    }
});

    inputjob.done(function(data) {      
        setTimeout(newjobs, 10000);    
});

    inputjob.fail(function(data) { 
        alert('Job not added....'); 
    });
   })();

</script>

1 个答案:

答案 0 :(得分:1)

对此进行调试我们会看到它告诉您添加&#39;不属于“未定义”的属性。这意味着&#39; row&#39;是t的未定义成员。这告诉我们t是某种东西[或者它可以通过说&#39; row&#39;不是未定义的属性]。

所以这告诉我t是某种东西,而不是你期望它的数据表对象。

查看您在帖子中包含的示例链接,我看到&#34; .DataTable()&#34;正在使用。 JavaScript中的对象和属性区分大小写,因此&#34; .dataTable()&#34;与&#34; .DataTable()&#34;。

不同

更改案例并查看是否可以解决您的问题。