将jquery数据表用于动态表行

时间:2010-01-28 13:03:29

标签: jquery dynamic-data datatables

我正在使用jquery / javascript动态构建表。我有几个链接,基于这些链接将使用json / jquery动态生成表体。

我喜欢将jquery数据表与动态创建的表集成。如何为动态创建的行附加.dataTable()

当我尝试在document.ready中使用时,该表保存了第一次创建表的值。

我的javascript看起来像:

    function GetProducts(Id) {
       $('#tProductListBody').html('');

       $.getJSON("/Product/GetProducts/?t=" + new Date(), { catId: Id },
        function(data) {
            var _productsBodyHtml = '';
            if (data != null && data != false) {
            for (i in data) {
                var _product = data[i];
                _productsBodyHtml += '<tr><td>' + _product.ProductName + '</td>';
                _productsBodyHtml += '<td>' + _product.QuantityInHand + '</td><td>' + _product.Price + '</td></tr>';
            }
            }
            $('#tProductListBody').html(_productsBodyHtml);
            $('#tProductList').dataTable();
        });
   }

使用上面的js函数,它会为链接的每次点击添加数据表。

dataTable()是一个jquery插件,它为html表提供排序,分页和搜索功能。该插件动态添加用于搜索的文本框和用于分页的寻呼机。

我面临的问题是,当我点击其中一个链接时,我动态构建表格,dataTable()再次添加另一个文本框和寻呼机,并在搜索和分页中提供先前创建的结果。我需要避免这种情况,dataTable()功能应该适用于最新的动态表格内容

如何为数据表重新定义此js函数,以免多次添加并应用最新的动态表?

1 个答案:

答案 0 :(得分:0)

看一下Datatables插件的fnReloadAjax自定义功能......