使用 DataTable 服务器端脚本在第二次单击按钮时无法调用 ajax
杰耶什
我正在使用带有服务器端脚本的数据表来显示按钮点击记录。第一次单击按钮时，我得到了正确的响应，但是第二次单击按钮时，ajax 正在调用。
我还为此使用了绘图功能。
我的ajax调用js文件：
$(document).on('click' , '.search-btn', function(){
var shape = "";
jQuery(".diamond_shape.diamond_selected").each(function () {
shape += jQuery(this).attr("title") + ",";
});
var clarity = '';
jQuery("#select-clarity").each(function () {
clarity += jQuery(this).attr("value") + ",";
});
var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
var dataTable = $('#example').DataTable( {
processing: true,
serverSide: true,
retrieve: true,
searching: false,
paging: false,
dataType: "json",
contentType: "application/json",
"ajax":{
"url" : ajaxurl, // json datasource
"type": "POST",
"data": {action: 'getFilterDiamonds',dataShape: shape , dataClarity : clarity },
},
"columns": [
{"data": "reportNo"},
{"data": "reference"},
{"data": "shape"},
{"data": "lab"},
{"data": "weight"},
{"data": "color"},
{"data": "clarity"}
]
});
});
我如何在输入值属性中添加选定的过滤器值：
杰耶什
- 终于找到了解决办法。只想在单击搜索按钮时销毁数据表。这是我的更改代码。
var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
$(document).on('click' , '.search-btn', function(){
var shape = "";
jQuery(".diamond_shape.diamond_selected").each(function () {
shape += jQuery(this).attr("title") + ",";
});
var clarity = '';
jQuery("#select-clarity").each(function () {
clarity += jQuery(this).attr("value") + ",";
});
/*- code to destory datatable -*/
if ($.fn.dataTable.isDataTable('#example')) {
$('#example').DataTable().destroy();
}
/*---*/
var dataTable = $('#example').DataTable( {
"scrollX": true,
processing: true,
serverSide: true,
retrieve: true,
searching: false,
destroy: true,
paging: false,
dataType: "json",
contentType: "application/json",
"ajax":{
"url" : ajaxurl, // json datasource
"type": "POST",
"data": {action: 'getFilterDiamonds',dataShape: shape , dataClarity : clarity },
},
"columns": [
{"data": "reportNo"},
{"data": "reference"},
{"data": "shape"},
{"data": "lab"},
{"data": "weight"},
{"data": "color"},
{"data": "clarity"}
]
});
});
使用以下代码数据表将删除旧数据并使用过滤器加载新数据。必须destroy: true在数据表函数中设置。
if ($.fn.dataTable.isDataTable('#example')) {
$('#example').DataTable().destroy();
}
谢谢大家的快速回复。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
使用Datatable Ajax服务器端处理时，请遵循外部过滤条件导出CSV / PDF
- 2
为什么不允许在jquery datatable服务器端处理ajax中使用成功？
- 3
Datatable jQuery + Ajax + PHP无法获取表中的数据（服务器端处理）
- 4
Div使用ajax和django进行第二次单击后显示/隐藏
- 5
使用Jquery和Ajax提交后，表单提交第二次无法正常工作
- 6
当使用ajax更新数据时，vuejs第二次不渲染数据
- 7
使用来自Ajax的参数调用php函数（DataTable jQuery）
- 8
无法获取要使用Codeigniter和Ajax填充的dataTable
- 9
如何使用 Jquery 在 Ajax 调用中调用 Mvc 服务器端验证
- 10
从PHP页面调用Datatable Ajax
- 11
使用ajax请求（$ .load）第二次加载页面时，jQuery Datepicker不起作用
- 12
使用MVC将多个值传递给服务器端Datatable Jquery中的一个按钮
- 13
不使用AJAX或PageMethods的服务器端函数的Javascript调用
- 14
PHP使用AJAX和DataTable发布数据
- 15
C＃使用Ajax从Datatable填充gridview
- 16
C＃使用Ajax从Datatable填充gridview
- 17
使用DataTable按钮而不使用DataTable
- 18
尝试在按钮单击时旋转div，但仅在第二次单击时有效（使用Javascript）
- 19
Ajax调用无法访问服务器端
- 20
使用Ajax调用.net，C＃获取客户端的服务器端字符串值
- 21
第二次调用后，Ajax复制请求
- 22
第二次单击时，ajax成功函数返回视图
- 23
为什么我的Angular的ng-show调用仅在使用Firebase的第二次单击时得到更新？
- 24
Ajax调用是在第二次提交表单时双重发布表单
- 25
使用jQuery第二次单击时调用的复选框的单击事件
- 26
JQ DataTable设置Ajax调用标头
- 27
AJAX：如何在单击按钮时在客户端和服务器端更改值？
- 28
使用服务器端脚本禁用按钮
- 29
如何使用Datatable传递POST类型的请求正文数据以使用Javascript在服务器端分页
我来说两句