javascript 单击时使用 ajax 调用重新加载数据表数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20003316/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Reload datatable data with ajax call on click
提问by nielsv
I have a datatable with ajax calls. I form the table like this:
我有一个带有 ajax 调用的数据表。我像这样形成表格：
var _initTable = function() {
$('#datatables tr').not(':first').on('click', function() {
var dateandtime = $(this).find(':nth-child(3)').text();
window.location.href = '/results/detail/dateandtime/' + dateandtime;
});
};
$('#datatables').dataTable({
bProcessing : true,
sProcessing : true,
bServerSide : true,
sAjaxSource : '/results/load-results',
fnServerParams: function ( aoData ) {
aoData.push( {"name": "quizid", "value": quizid },{ "name": "questionid", "value": questionid } );
},
aoColumnDefs : [{'bSortable' : false, 'aTargets' : ['no-sort']}], // make the actions column unsortable
sPaginationType : 'full_numbers',
fnDrawCallback : function(oSettings) {
_initTable();
}
});
As you can see I send 2 parameters to my php action.
Now I would like to reload the table when I click on a button. So what I want to do is make another ajax call and send other parameters (quizid will be the same, but the questionid will be different).
如您所见，我向我的 php 操作发送了 2 个参数。
现在我想在单击按钮时重新加载表格。所以我想要做的是再次调用ajax并发送其他参数（quizid会相同，但questionid会不同）。
I know you have something like this oTable.fnReloadAjax(newUrl);but what should I paste at the newUrl parameter??
我知道你有这样的东西，oTable.fnReloadAjax(newUrl);但我应该在 newUrl 参数中粘贴什么？
I've made a jsfiddle: http://jsfiddle.net/8TwS7/
我做了一个 jsfiddle：http: //jsfiddle.net/8TwS7/
回答by Jay Rizzi
you should be able to accomplish this by using fnServerData instead of fnServerParams
您应该能够通过使用 fnServerData 而不是 fnServerParams 来完成此操作
var oTable = $('#datatables').dataTable({
bProcessing : true,
sProcessing : true,
bServerSide : true,
sAjaxSource : '/results/load-results',
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some extra data to the sender */
aoData.push( { "name": "quizid", "value": quizid } );
aoData.push( { "name": "question_id", "value": question_id } );
$.getJSON( sSource, aoData, function () {
/* Do whatever additional processing you want on the callback, then tell DataTables */
}).done(function(json){
fnCallback(json);
}).fail(function(xhr, err){
var responseTitle= $(xhr.responseText).filter('title').get(0);
alert($(responseTitle).text() + "\n" + formatErrorMessage(xhr, err) );
});
},
});
you should be able to then call a click function to redraw your table no problem using the fnDraw API call on the variable we created on datatable initialization
然后你应该能够调用一个点击函数来重绘你的表格，使用 fnDraw API 调用我们在数据表初始化时创建的变量没有问题
$('#somelement').on('click', function(){
oTable.fnDraw();
});
