2

我试图在单击批准按钮后重绘数据表并且一旦 ajax 请求成功。

一切都在点击功能中工作（它保存到数据库，它动画，它向上滑动）但表格不会重绘。

有没有人对它为什么不起作用有任何想法？

  $('a.approve').click(function(e) {
    e.preventDefault();
    var parent = $(this).closest("tr");
    $.ajax({
      type: 'get',
      url: 'index.php',
      data: 'ajax=1&approve='+ parent.attr('id').replace('record-','')+'&employee='+ parent.attr('title')+'&acyear=' + parent.attr('lang'),
      beforeSend: function() {
        parent.animate({'backgroundColor':'#fb6c6c'},300);
      },
      success: function() {
        parent.slideUp(300,function() {
          parent.remove();
        var $aTable= $("#table_a").dataTable( { bRetrieve : true } );
        var $bTable= $("#table_b").dataTable( { bRetrieve : true } );
        $aTable.fnDraw();
        $bTable.fnDraw();
        });

      }
    });
  });
4

4 回答 4

1

聚会有点晚了，但我刚刚经历了这个，所以我想我会把答案留在这里。

默认情况下，JQuery 不会阻止缓存 ajax 响应。Chrome 和 Firefox 似乎无论如何都不会缓存这些调用，所以它们更新得很好。另一方面，IE 总是缓存 ajax 响应，即使是硬页面刷新也不会刷新它们。解决方案是始终在您的 ajax 调用中包含一个 cache: "false" 设置，如下所示：

$.ajax({
    type: 'get',
    cache: false,
    url: 'index.php',
    data: 'ajax=1',
    success: function() {
      ...
    }
);

数据表对此产生了额外的影响：默认情况下，它们会为您关闭缓存（从 v. 1.7 开始）。所以如果你只是设置了一个 ajax url，一个数据表应该可以更新：

$("#myTable").dataTable({
    "bProcessing": true,
    "sAjaxSource": "getAssayBatches.json",  // URL that retrieves the data
    // datatable leaves caching off by default. Table refreshes ok!
});

但是，如果您需要进行一些额外的处理并覆盖“fnServerData”函数，则会丢失默认缓存设置，这意味着缓存会重新打开：

$("#myTable").dataTable({
    "bProcessing": true,
    "sAjaxSource": "getAssayBatches.json",  // URL that retrieves the data

    // the following parameter turns caching back on, meaning stale data in IE!
    "fnServerData": function (sSource, aoData, fnCallback) {
        $.getJSON(sSource, aoData, function (json) {
            var data = {"aaData": json};
            fnCallback(data);
        });
    }
});

所以你需要把 cache: false 也放在这里以确保表得到更新：

$("#myTable").dataTable({
    "bProcessing": true,
    "sAjaxSource": "getAssayBatches.json",  // URL that retrieves the data

    // same ajax call as above, but this time with cache: false 
    // to ensure the table gets updated
    "fnServerData": function (sSource, aoData, fnCallback) {
        $.ajax({
            type: "GET",
            cache: false,
            url: sSource,
            data: aoData,
            success: function (json) {
                var data = {"aaData": json};
                fnCallback(data);
            }
        });
    }
});

希望这可以帮助某人。

于 2013-08-05T23:07:56.530 回答
0

为了从数据库中获取新的表数据，您index.php需要将表值作为 JSON 返回：

{
  "sEcho": 1,
  "iTotalRecords": "2",
  "iTotalDisplayRecords": "2",
  "aaData": [
    [
      "Gecko",
      "Firefox 1.0",
      "Win 98+ / OSX.2+",
      "1.7",
      "A"
    ],
    [
      "Gecko",
      "Netscape Navigator 9",
      "Win 98+ / OSX.2+",
      "1.8",
      "A"
    ]       ]
}

和成功的部分：

success: function(json) {
        parent.slideUp(300, function() {
            parent.remove();

            var obj = JSON.parse(json);//get new data
            oTable.fnClearTable();//clear table
            for (x in obj.aaData)
                oTable.fnAddData(obj[x]); //populate table

            //redo another ajax if you have several table.
        });

如果仅更改了 1 行，则删除该行，以 JSON 格式从服务器返回该行并在表中重新插入该行。

于 2012-08-31T02:12:02.287 回答
0

我看不到足够的代码来了解您的确切需求。

我猜你的parentvar 代表你的一个数据表中的一行，并且你想从数据表中删除它。

dataTable 保留其数据的内部缓存，调用parent.remove()不会更新此缓存。

如果你想从数据表中删除一行，你应该使用 API 函数fnDeleteRow：

// remove your "parent.remove()" line
$aTable.fnDeleteRow(parent[0])
于 2012-08-29T16:44:09.223 回答
-1

oTable.fnReloadAjax();成功后结果重新绑定表

$(document).ready(function () {

$.fn.dataTableExt.oApi.fnReloadAjax = function (oSettings, sNewSource, fnCallback, bStandingRedraw) {
    if (typeof sNewSource != 'undefined' && sNewSource != null) {
        oSettings.sAjaxSource = sNewSource;
    }
    this.oApi._fnProcessingDisplay(oSettings, true);
    var that = this;
    var iStart = oSettings._iDisplayStart;
    var aData = [];

    this.oApi._fnServerParams(oSettings, aData);

    oSettings.fnServerData(oSettings.sAjaxSource, aData, function (json) {
        /* Clear the old information from the table */
        that.oApi._fnClearTable(oSettings);

        /* Got the data - add it to the table */
        var aData = (oSettings.sAjaxDataProp !== "") ?
            that.oApi._fnGetObjectDataFn(oSettings.sAjaxDataProp)(json) : json;

        for (var i = 0; i < aData.length; i++) {
            that.oApi._fnAddData(oSettings, aData[i]);
        }

        oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
        that.fnDraw();

        if (typeof bStandingRedraw != 'undefined' && bStandingRedraw === true) {
            oSettings._iDisplayStart = iStart;
            that.fnDraw(false);
        }

        that.oApi._fnProcessingDisplay(oSettings, false);

        /* Callback user function - for event handlers etc */
        if (typeof fnCallback == 'function' && fnCallback != null) {
            fnCallback(oSettings);
        }
    }, oSettings);
}
});
于 2012-08-22T13:42:28.900 回答