datatable ajax datasrc,datatables插件ajax发送post数据的问题

在用datatables插件的时候碰到的问题,想用button onclick时间触发table的reload,从而将一个input元素中用户输入的内容post到后台,以下是我写的简单的例子

$(document).ready( function () {

$('#table_id').DataTable({

"processing": true,

"serverSide": true,

"ajax": {

url:"http://localhost/mmm",

type:"POST",

data:{"name":document.getElementById('test').value}

/*data:{"name":"xdf"}*/

}

});

} );

check

Column 1

Column 2

Row 1 Data 1

Row 1 Data 2

Row 2 Data 1

Row 2 Data 2

在chrome中我能看到javascript发出的http报文,当用注释中的data:{"name":"xdf"}时,http报文中确实有xdf这个值,然而换成data:{"name":document.getElementById('test').value}的时候,报文中name的值是空,不论输入什么值都是这样,求大神解答

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,我可以帮你解答这个问题。 要实现datatable发送ajax删除和添加功能,你需要进行以下步骤: 1. 在datatable的初始化中,设置删除和添加按钮的相关参数,例如按钮的class、id等。 2. 编写ajax请求的代码,用于向后端发送删除或添加数据的请求。 3. 在删除或添加按钮的点击事件中,调用ajax请求的代码,并传递相应的参数。 以下是一个简单的示例代码: ``` // 初始化datatable var table = $('#example').DataTable({ // 设置删除和添加按钮的class和id columnDefs: [{ targets: [4], data: null, defaultContent: "<button class='btn btn-danger btn-sm delete-btn' id='delete-btn'>删除</button><button class='btn btn-success btn-sm add-btn' id='add-btn'>添加</button>" }] }); // 删除按钮点击事件 $('#example tbody').on('click', '.delete-btn', function () { var data = table.row($(this).parents('tr')).data(); // 发送ajax请求 $.ajax({ url: '/delete', type: 'POST', data: {id: data[0]}, success: function () { // 删除成功后,重新加载datatable table.ajax.reload(); } }); }); // 添加按钮点击事件 $('#add-btn').click(function () { // 获取添加数据的表单数据 var formData = $('#add-form').serialize(); // 发送ajax请求 $.ajax({ url: '/add', type: 'POST', data: formData, success: function () { // 添加成功后,重新加载datatable table.ajax.reload(); } }); }); ``` 在上述代码中,我们首先在datatable的初始化中设置了删除和添加按钮的class和id。然后,在删除和添加按钮的点击事件中,分别调用了发送ajax请求的代码,并传递相应的参数。最后,当删除或添加成功后,重新加载了datatable。 需要注意的是,具体的ajax请求的参数和返回值需要根据你的后端代码进行相应的调整。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值