繁体   English   中英

在数据表 ajax 调用成功时调用 function

[英]call a function in success of datatable ajax call

是否有可能在数据表 ajax 调用成功时调用 javascript function。 这是我尝试使用的代码,

var oTable = $('#app-config').dataTable(
            {
                "bAutoWidth": false,                                                
                "bDestroy":true,
                "bProcessing" : true,
                "bServerSide" : true,
                "sPaginationType" : "full_numbers",
                "sAjaxSource" : url,                    
                "fnServerData" : function(sSource, aoData, fnCallback) {
                    alert("sSource"+ sSource);
                    alert("aoData"+ aoData);
                    $.ajax({
                        "dataType" : 'json',
                        "type" : "GET",
                        "url" : sSource,
                        "data" : aoData,
                        "success" : fnCallback
                    });
                }

有没有可能有类似的东西,

success : function(){
    //.....code goes here
}

而不是“成功”:fnCallback ------> 这是 AJAX 调用的最后一行。 在这个 function 中,我想检查从服务器端发送的值。

您可以使用 dataSrc :

这是datatables.net的典型示例

var table = $('#example').DataTable( {
    "ajax": {
            "type" : "GET",
            "url" : "ajax.php",
            "dataSrc": function ( json ) {
                //Make your callback here.
                alert("Done!");
                return json.data;
            }       
            },
    "columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }

        ]
    } );

你可以使用这个:

"drawCallback": function(settings) {
   console.log(settings.json);
   //do whatever  
},

我发现的最好方法是使用initComplete方法,因为它在检索数据并呈现表后触发。 请注意,这只会触发一次。

$("#tableOfData").DataTable({
        "pageLength": 50,
        "ajax":{
            url: someurl,
            dataType : "json",
            type: "post",
            "data": {data to be sent}
        },
        "initComplete":function( settings, json){
            console.log(json);
            // call your function here
        }
    });

对于数据表 1.10.12。

$('#table_id').dataTable({
  ajax: function (data, callback, settings) {
    $.ajax({
      url: '/your/url',
      type: 'POST',
      data: data,
      success:function(data){
        callback(data);
        // Do whatever you want.
      }
    });
  }
});

这对我来说很好用。 另一种方法行不通

                'ajax': {
                    complete: function (data) {
                        console.log(data['responseJSON']);
                    },
                    'url': 'xxx.php',
                },

ajax 的成功选项不应更改,因为 DataTables 在内部使用它来在数据加载完成时执行表格绘制。 建议使用“dataSrc”来更改接收到的数据。

根据文档,当 Ajax 请求完成时,将触发xhr Ajax 事件。 所以你可以做这样的事情:

let data_table = $('#example-table').dataTable({
        ajax: "data.json"
    });

data_table.on('xhr.dt', function ( e, settings, json, xhr ) {
        // Do some staff here...
        $('#status').html( json.status );
    } )

也许这不完全是您想要做的,但是使用 ajax complete 解决了我在 ajax 调用返回时隐藏微调器的问题。

所以它看起来像这样

var table = $('#example').DataTable( {
    "ajax": {
            "type" : "GET",
            "url" : "ajax.php",
            "dataSrc": "",
            "success": function () {
                alert("Done!");
            }       
    },
    "columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }            
        ]
    } );

是否有可能在成功进行数据表Ajax调用时调用javascript函数。 这是我要使用的代码,

var oTable = $('#app-config').dataTable(
            {
                "bAutoWidth": false,                                                
                "bDestroy":true,
                "bProcessing" : true,
                "bServerSide" : true,
                "sPaginationType" : "full_numbers",
                "sAjaxSource" : url,                    
                "fnServerData" : function(sSource, aoData, fnCallback) {
                    alert("sSource"+ sSource);
                    alert("aoData"+ aoData);
                    $.ajax({
                        "dataType" : 'json',
                        "type" : "GET",
                        "url" : sSource,
                        "data" : aoData,
                        "success" : fnCallback
                    });
                }

是否可能有类似的东西,

success : function(){
    //.....code goes here
}

而不是“成功”:fnCallback ------>这是AJAX调用的最后一行。 在此功能中,我想检查从服务器端发送的值。 在此先感谢您的帮助。

根据问题,我认为以下内容就足够了:

 'ajax': {
              complete: function (data) {
               console.log(data['responseJSON']);
             },
                
            },

尝试以下代码。

       var oTable = $('#app-config').dataTable(
        {
            "bAutoWidth": false,                                                
            "bDestroy":true,
            "bProcessing" : true,
            "bServerSide" : true,
            "sPaginationType" : "full_numbers",
            "sAjaxSource" : url,                    
            "fnServerData" : function(sSource, aoData, fnCallback) {
                alert("sSource"+ sSource);
                alert("aoData"+ aoData);
                $.ajax({
                    "dataType" : 'json',
                    "type" : "GET",
                    "url" : sSource,
                    "data" : aoData,
                    "success" : fnCallback
                }).success( function(){  alert("This Function will execute after data table loaded");   });
            }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM