如何在服务器端处理模式下发送表单数据和jQuery DataTables数据
How to send form data along with jQuery DataTables data in server-side processing mode
我试图发布表单数据没有成功,数据无法加载。
如何将所有表单数据与数组和单个文本框,组合框等传递给fnServerdata
?
table_obj = $('#group-table').dataTable({
"sAjaxSource": "URL Goes here",
fnServerData: function(sSource, aoData, fnCallback,oSettings) {
oSettings.jqXHR = $.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource+'?'+$.param(aoData),
"data": $("#frm").serializeArray(),
"success": fnCallback
} );
},
aaSorting: [[ 1, "desc" ]],
bProcessing: true,
bServerSide: true,
processing : true,
columnDefs: [{
'targets': 0,
'searchable':false,
'orderable':false,
'className': 'dt-body-center',
'render': function (data, type, full, meta){
return '<label><input type="checkbox" name="user_id[]" value="' + $('<div/>').text(data).html() + '"></label>';
}
}],
rowCallback: function(row, data, dataIndex){
// If row ID is in list of selected row IDs
if($.inArray(data[0], rows_selected) !== -1){
$(row).find('input[type="checkbox"]').prop('checked', true);
$(row).addClass('selected');
}
},
iDisplayLength: '50',
});
如果要格式化POST
数据,也可以使用jquery .each()
函数格式化表单数据。让我使用上面的答案,使用解决方案#1,但使用jquery .each()
来格式化数据。
$('table').DataTable({
"ajax": {
"url": "URL HERE",
"type": "POST",
"data": function(d) {
var frm_data = $('form').serializeArray();
$.each(frm_data, function(key, val) {
d[val.name] = val.value;
});
}
}
});
你可以在PHP中访问它,比如:
var $data = $_POST['name'];
解决方案1
替换:
$('#group-table').dataTable({
"sAjaxSource": "URL Goes here",
fnServerData: function(sSource, aoData, fnCallback,oSettings) {
oSettings.jqXHR = $.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource+'?'+$.param(aoData),
"data": $("#frm").serializeArray(),
"success": fnCallback
} );
},
:
$('#group-table').dataTable({
"ajax": {
"url": "URL Goes here",
"type": "POST",
"data": function(d){
d.form = $("#frm").serializeArray();
}
},
您的表单数据将在form
参数中作为具有参数name
和value
的对象数组,以下是JSON表示:
"form": [{"name":"param1","value":"val1"},{"name":"param2","value":"val2"}]
解决方案2
如果您希望将表单数据作为名称/值对,请参阅此jsFiddle以获取另一种解决方案的示例。
指出
数据表中有复选框。上面的解决方案不适用于数据表中的表单元素,因为DataTable从DOM中删除了不可见的节点。
这个怎么样?
$('#group-table').DataTable( {
"processing": true,
"serverSide": true,
"bDestroy": true,
"bJQueryUI": true,
"ajax": {
"url": "url here",
"type": "POST",
"data": {
store: $('#store').val(),
month: $('#m').val(),
year: $('#y').val(),
status: $('#status').val(),
},
}
} );
,那么您可以通过PHP访问上面的示例数据。
$_POST['store']
$_POST['month']
$_POST['year']
$_POST['status]
希望对你有帮助。
相关文章:
- 如何从pdftron webviewer获取表单数据
- JS验证ajax返回的html中的表单数据
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- 将单击事件添加到数据表
- 预览数据表单
- Ajax数据表单序列化防止双重提交
- 如何在 Spring Framework 中处理表数据表单提交
- 发布大型数据表单 Angular JS
- 覆盖Magento中的默认数据表单提交JS活动
- 保存不带按钮的数据表单
- 更新Highchart数据表单导出按钮
- 将数据表单转换为PDF
- 我的Angular视图没有用数据表单服务器更新
- 如何在不重新加载页面的情况下获取数据表单数据库
- JavaScript SDK返回数据表单嵌套函数
- 使用php AJAX发送数据表单请求失败
- 数据表单$scope在Angular的view (page)中不显示
- 实时交换 HTML 数据表单
- 搜索parse.com数据表单html输入
- 如何在MVC中返回JSON数据表单控制器到jsp