超全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因为 ...
随机推荐
- UI5-文档-4.38-Accessibility
作为本教程的最后一步,我们将改进应用程序的可访问性. 为此,我们将添加ARIA属性.屏幕阅读器使用ARIA属性识别应用程序结构并正确解释UI元素.通过这种方式,我们可以让我们的应用程序对那些使用电脑有 ...
- 更改maven下载jar的仓库为阿里云仓库
修改settings.xml <!-- 配置本地maven的仓库 --> <localRepository>D:\file\path\maven\repository</ ...
- 关于str.split(",")中间 什么时候该加\\转义
java 分割符,对于某些符号的分割符进行切割的时候需要加转义字符,我贴上例子 1. package test1; public class split { public static void ma ...
- How to Pronounce the Word SOMETHING
How to Pronounce the Word SOMETHING Share Tweet Share Something tells me you’re going to like this v ...
- 吴裕雄 数据挖掘与分析案例实战(4)——python数据处理工具:Pandas
# 导入模块import pandas as pdimport numpy as np # 构造序列gdp1 = pd.Series([2.8,3.01,8.99,8.59,5.18])print(g ...
- SPARK数据类型
转自: http://www.cnblogs.com/tuitui1989/p/5331113.html 一.本地向量 有如下几个类: Vector(基类),DenseVector,SparseVec ...
- uboot的配置及编译
1. 先执行配置命令 make board_name_config 再执行编译命令 make all 2. 通过在Makefile中找到 board_name_config 目标,可以查看为了得到目标 ...
- tomcat 设置内存
SET JAVA_OPTS=-Xms256m -Xmx512m -XX:PermSize=256M -XX:MaxPermSize=512M -Xms :初始化堆内存值 -Xmx :堆内存最大值 -X ...
- Hbase—学习笔记(一)
此文的目的: 1.重点理解Hbase的整体工作机制 2.熟悉编程api,能够用来写程序 1. 什么是HBASE 1.1. 概念特性 HBASE是一个数据库----可以提供数据的实时随机读写 HB ...
- Spring Boot AOP
AOP为Aspect Oriented Programming的缩写,意为:面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术.AOP是Spring框架中的一个重要内容,它通 ...