超全table功能Datatables使用的填坑之旅--2:post 动态传参: 解决: ajax 传参无值问题.
官网解释与方法:1 当向服务器发出一个ajax请求,Datatables将会把服务器请求到的数据构造成一个数据对象。
2 实际上他是参考jQuery的ajax.data属性来的,他能添加额外的参数传给服务器。
3 Datatables在此基础上还提供了一个函数,以便Datatables在请求服务器的时候可以处理这些数据.
下面举几个栗子:参数格式是必须和例子一样:
*最优选:post动态传参方法:
// 优点: 可动态获得参数的值,防止各种获得参数为null的bug!
var myTable = $("#example").DataTable({
ajax: {
url: "http://xingJinYuBlog/index",
data: {
function (d) {
return {
"XXX": $('#extra').val(),
"XXX1": $('#extra1').val()
}
} }
}
}); //重新渲染表格, 动态改变ajax参数值
function reloadTable() {
var param = {
"name": $("#seName").val(),
"admin": $("#seAdmin").val()
};
myTable.settings()[0].ajax.data = param;
myTable.ajax.reload();
}
注意:
1 上面的param对象的内容, 对应是d对象的内容.
2 重新渲染表, 执行reloadTable(),即可实现.
下面是其他的方法:
1 添加一个静态值,来提交额外的参数(user_id)
特点:--post方法, 静态传参
$('#example').dataTable( {
"ajax": {
"url": "http://xingJinYuBlog/index",
"data": {
"user_id":
}
}
} );
2 通过操作数据对象添加数据请求(函数没有返回)
特点:--post方法, 动态传参
$('#example').dataTable( {
"ajax": {
"url": "http://xingJinYuBlog/index",
"data": function ( d ) { d.extra_search = $('#extra').val(); } } } );
3 添加数据请求(函数有返回)
特点:--post方法, 动态传参
$('#example').dataTable( {
"ajax": {
"url": "http://xingJinYuBlog/index",
"data": function ( d ) { return $.extend( {}, d, { "extra_search": $('#extra').val() } ); } } } );
4 以json格式提交
特点:--post方法, 动态传参
$('#example').dataTable( {
"ajax": {
"url": "http://xingJinYuBlog/index",
"contentType": "application/json",
"data": function ( d ) {
var d ={},
d.xxx=$('#extra').val();
return JSON.stringify( d );
}
}
} );
参考文章有官网:
http://datatables.club/reference/option/ajax.data.html
https://datatables.net/forums/discussion/21940/how-to-pass-new-post-parameters-on-ajax-reload
超全table功能Datatables使用的填坑之旅--2:post 动态传参: 解决: ajax 传参无值问题.的更多相关文章
- 超全table功能Datatables使用的填坑之旅--1: 无法渲染表格数据: ajax调用了参数 : success
问题:Datatables: 无法渲染表格数据 原因:datatables的ajax 传了"success":function(){},导致无法渲染数据. ajax 删掉" ...
- bootstrap-table填坑之旅<一>认识bootstrap-table
应公司需求,改版公司ERP的数据显示样式.由于前期开发的样式是bootstrap,所以选bootstrap-table理所当然(也是因为看了bootstrap-table官网的example功能强大, ...
- React Native填坑之旅--布局篇
代码在这里: https://github.com/future-challenger/petshop/tree/master/client/petshop/src/controller 回头看看RN ...
- React Native填坑之旅--动画
动画是提高用户体验不可缺少的一个元素.恰如其分的动画可以让用户更明确的感知当前的操作是什么. 无疑在使用React Native开发应用的时候也需要动画.这就需要知道RN都给我们提供了那些动画,和每个 ...
- 使用vue开发微信公众号下SPA站点的填坑之旅
原文发表于本人博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅.作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^ ...
- stm32填坑之旅 - stm32f103c8t6点亮板载贴片蓝色LED
转载请注明:https://www.cnblogs.com/rockyf/p/11691622.html 开篇 开篇一定要精彩,不然路人不理睬!下述是笔者作为arm小白的填坑之旅 没错,这个之前一直从 ...
- React Native填坑之旅--与Native通信之iOS篇
终于开始新一篇的填坑之旅了.RN厉害的一个地方就是RN可以和Native组件通信.这个Native组件包括native的库和自定义视图,我们今天主要设计的内容是native库方面的只是.自定义视图的使 ...
- React Native填坑之旅--Flow篇(番外)
flow不是React Native必会的技能,但是作为正式的产品开发优势很有必要掌握的技能之一.所以,算是RN填坑之旅系列的番外篇. Flow是一个静态的检查类型检查工具,设计之初的目的就是为了可以 ...
- https填坑之旅
Boss说,我们买了个权威证书,不如做全站式的https吧,让用户打开主页就能看到受信任的绿标.于是我们就开始了填坑之旅. [只上主域好不好?] 不好...console会报出一大堆warning因为 ...
随机推荐
- nginx 无法访问root权限的文件内容
问题: 按照的nginx,nginx配置的user 是 nginx,nginx 是root用户启动的. 文件夹A放的那啥是root用户上传的文件. 可 nginx 无法访问 到 文件. 方法: ...
- 因为链接服务器 "SQLEHR" 的 OLE DB 访问接口 "SQLNCLI10" 无法启动分布式事务
1.运行 regedt32,浏览至 HKEY_LOCAL_MACHINE\Software\Microsoft\MSDTC. 添加一个 DWORD 值 TurnOffRpcSecurity,值数据为 ...
- eclispse修改项目项目编码
最近遇到问题,在myeclipse新建或导入项目后,有些文件中文显示乱码,每次都要在项目property中修改其编码,所以想到一次性解决所有编码问题,让项目新建或导入之后自动是utf-8编码,这样就不 ...
- keras做DNN
输入的数据集是10000行,31645列,其中前31644是特征,最后一列是标签值.训练集和测试集格式是一样的. 特征值都是0,1形式,表示有还是没有这个特征,标签值是0,1形式,2分类. impor ...
- KNN识别手写数字
一.问题描述 手写数字被存储在EXCEL表格中,行表示一个数字的标签和该数字的像素值,有多少行就有多少个样本. 一共42000个样本 二.KNN KNN最邻近规则,主要应用领域是对未知事物的识别,即判 ...
- 格式化java8 LocalDateTime
DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss", Locale.CHINA).format(time1);
- 让IIS支持PHP的配置步骤
本文转自:http://marsren.blog.51cto.com/116511/41199/ 在Windows Server 2003的IIS6下配置ISAPI方式的PHP,配置方法是,在IIS的 ...
- 第八章 高级搜索树 (b4)B-树: 插入
- 【校招面试 之 C/C++】第1题 为什么优先使用构造函数的初始化列表
1.首先看一个例子: #include<iostream> using namespace std; class Test1 { public: Test1() // 无参构造函数 { c ...
- fckeditor 数据库 取值 显示
用fckeditor把html代码存到数据库中,取出来显示的时候用什么控件呢?用Literal 或 Label 控件.