Question

我有ajax代码和函数drawVisualisation();

当我加载页面时，我有代码：

$(document).ready(function() {
    drawVisualization();
});

并且代码运行良好，但是当我在成功函数上调用ajax时，我也调用函数：

success: function(data) {
    $('#myModal').modal('hide');
    drawVisualization();
    console.log('SUCCESS'); 
    $('#addFieldForm').each (function(){
        this.reset();
    });

但是这次调用了函数，但我的#example div不想刷新

如何在第二次调用函数#example时刷新drawVisualisation();？

功能：

function drawVisualization() {
   $('#example').dataTable({
       "ajax": "getN.php",
       paging: false,
       //"dom":' <"search"f><"top"l>rt<"bottom"ip><"clear">',
       "fnFooterCallback": function (nRow, aasData, iStart, iEnd, aiDisplay) {
           var columnas = [2, 3, 4]; //the columns you wish to add            
           for (var j in columnas) {
               var columnaActual = columnas[j];
               var total = 0;
               for (var i = iStart; i < iEnd; i++) {
                   total = total + parseFloat(aasData[aiDisplay[i]][columnaActual]);
               }
               $($(nRow).children().get(columnaActual-1)).html(total);
           }
       }, // end ,
       "columns": 
       [
           {"data": "ID"},
           {"data": "naziv"},
           {"data": "ha"},
           {"data": "ar"},
           {"data": "m2"},
           {"data": "lokacija"},
           {"data": "osnov"},
           {"data": "kat_kul"},
           {"data": "akcija"}
       ],
       "columnDefs": 
       [
           {
               "targets": 8,
               "data": "akcija",
               "render": function(data, type, full, meta) {
                   // return data; 
                   return '<div style="float:right;"><button class="btn btn-warning">Izmeni</button> <button class="btn btn-info">Izvestaj o parceli</button> <i class="fa fa-times"></i></div>';
               }
           },
           {"targets": 0, "visible":false}
       ]
   });
};

Answer 1

您可以尝试此操作以强制您的元素刷新。我有时使用它并且它有效，因为你有webkit的问题，但我想它应该适用于其他浏览器，如果你只是删除“-webkit - ”

element.style.webkitTransform = 'scale(1)';

Answer 2

首先需要在元素上使用destroy数据表，然后再次为该元素初始化数据表：

success: function(data) {
    $('#myModal').modal('hide');
    // destroy old:
    $('#example').dataTable().fnDestroy();
    drawVisualization();
    console.log('SUCCESS'); 
    $('#addFieldForm').reset();
}

Jquery运行成功的功能

2 个答案: