数据表，更改 AJAX 数据（不使用元素）

Posted 2023-05-08

【中文标题】数据表，更改 AJAX 数据（不使用元素）

【英文标题】：Datatables, change AJAX data ( not with elements )

【发布时间】：2015-10-10 21:39:56

【问题描述】：

我有一个由 AJAX 填充的数据表。一切都很好，但我想要一些快捷方式来从服务器请求数据。问题是如何更改即时发送的数据？我知道我可以创建一个元素 <input> 或其他东西，它可以从中获取价值，但我希望一旦点击某些东西我可以更改数据。

var Table = $('#table').DataTable(
            "ajax": 
                "type" : "POST",
                "url": "url",
                "data": function ( d ) 
                    d.cmd = "offline";
                
            ,
        );

这可以正常工作并将cmd 作为offline 传递回服务器。 如何在调用 ajax.reload 之前更改点击时的值。

$('#online_btn').on( 'click', function () 
            Table.ajax.reload();
         );

使用这个

$('#online_btn').on( 'click', function () 
            var d = [];
            d.cmd = "online";
            Table.ajax.data(d);
            Table.ajax.reload();
         );

返回 ajax.data is not a function 错误

【参考方案1】：

您可以修改一个对象并使用$.extend() 在数据函数中合并

var myData =;
var Table = $('#table').DataTable(
            "ajax": 
                "type" : "POST",
                "url": "url",
                "data": function ( d ) 
                   return  $.extend(d, myData);
                
            ,
        );

$('#online_btn').on( 'click', function ()             
            myData.cmd = "online";            
            Table.ajax.reload();
);

【讨论】：

即将开始实施类似的东西。正是我要找的东西

@charlieftl 我刚才需要做这种事情。搜索了很多，但没有找到像您这样的超级简单示例，该示例演示了如何使用数据表的 ajax 功能的数据选项。感谢这个简单但非常有用的例子！！

我已经为此苦苦挣扎了几天。你的例子就像一个魅力！非常感谢。

最佳答案让我免于一整天的不成功搜索！

【参考方案2】：

在发送对象之前使用 jquery ajax。

$.ajax(
 url: "http://fiddle.jshell.net/favicon.png",
 beforeSend: function( xhr ) 
   //update your value here

)

来源：jquery documentation

发送前 类型：函数（jqXHR jqXHR，PlainObject 设置） 一个预请求回调函数，可用于在发送之前修改 jqXHR（在 jQuery 1.4.x 中为 XMLHTTPRequest）对象。使用它来设置自定义标题等。 jqXHR 和设置对象作为参数传递。这是一个 Ajax 事件。在 beforeSend 函数中返回 false 将取消请求。从 jQuery 1.5 开始，无论请求类型如何，都将调用 beforeSend 选项。

【讨论】：

这就是将函数传递给ajax.data 属性所做的只是在插件内部完成

【参考方案3】：

我在 2021 年这样做：

function customSearch()
        let t = JSON.parse(window.filter);
        t["custom-field"] =  $('input[name="custom-field"]').val() || "";
        window.filter = JSON.stringify(t);
        return window.filter;

const table = $('#table').DataTable(
        ajax:
           url:"my-wonderful-url.json",
           type:"POST",
           data: function(d) 
            const t = customSearch();
            return  Object.assign(d, filter:t);
        ,
        error:function(e)console.log(e);,            
);
 $('input[name="custom-field"]').on('keyup', function(e)         
    table.ajax.reload(null, false);
);