发布服务器参数并重新绘制新的源代码 [英] Post server params and redraw with new source
本文介绍了发布服务器参数并重新绘制新的源代码的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
var tableObjects = $（＃logTable）。DataTable（{
bProcessing：false，
bServerSide：true，
sAjaxSource：../../Controller/DashboardController.php5，
aoColumns：[
{mDataProp：clientname sortable：false}，
{mDataProp：clientip}，
{mDataProp：url，sortable：false}，
{mDataProp
{mDataProp：loggingdate}，
{mDataProp：reqmethod}，
{mDataProp：resultcode}，
{mDataProp：duration}，
{mDataProp：tierycode}
]，
fnServerData：function（sSource，aoData，fnCallback）{
aoData.push（{name：tablename，value：dashboard}）
//在slcbox中选择一个项目后，我将其添加为参数，因此我只需要编辑此方案。
调试器
$ .ajax（{
dataType：json ，
contentType：application / json; charset = utf-8，
type：GET，
url：sSource，
data：aoData，
success ）{
fnCallback（result）;
}，
error：function（xhr，textStatus，error）{
debugger
if（typeof console ==object ）{
console.log（xhr.status +，+ xhr.responseText +，+ textStatus +，+错误）;
}
}}）;
}，
oLanguage：{
sLengthMenu：'< select>'+
'< option value =5> 5< / option>'+
'< option value =10> 10< / option>'+
'< option value =20> 20< / option>'+
' ; option value =30> 30< / optio n>'+
'< option value =40> 40< / option>'+
'< option value =50> 50< / option> $ b'< / select>显示'
}，
fnCreatedRow：function（nRow，aData，iDataIndex）{
}）;
}，
fnDrawCallback：function（）{
}，
aaSorting：[
[2，'asc']
]
aLengthMenu：[
[5，15，20，-1]，
[5，15，20，全部] //每页更改
]，
iDisplayLength：5
}）
远，但是当然它会抛出aoData undefined，fncallback未定义的错误..似乎一定有其他方式来做到这一点
on（change，function（）{
debugger
tableObjects.fnServerData（../../Controller/DashboardController.php5）（＃slcFilter ，aoData，fnCallback）
{
aoData.push（{name：tablename，value：dashboard}）
调试器
$ .ajax（{
dataType：json，
contentType：application / json; charset = u tf-8，
type：GET，
url：sSource，
data：aoData，
success
fnCallback（result）;
}，
error：function（xhr，textStatus，error）{
debugger
if（typeof console ==object）{
console.log（xhr .status +，+ xhr.responseText +，+ textStatus +，+错误）;
}
}}）;
}
}）;
解决方案
添加另一个 aoData.push （）将会将选择器的值添加到要发送到服务器的数据，如下所示：
fnServerData：function（sSource，aoData，fnCallback）{
aoData.push（{name：tablename，value：dashboard}）
aoData.push（{name：select，value：$（＃slcFilter）。val（）}）;
// ...跳过...
}
然后你需要调用 draw API方法（如果初始化为 DataTable（））或 fnDraw API方法（如果在 dataTable（）中初始化） >更改处理程序选择元素来重新绘制表并向服务器发送一个新请求。
$（＃slcFilter）。on（change，function（）{
$（＃logTable）。
}）;
I'm using jQuery DataTables. Here is my datatable, at page load server fills datatable with response that's fine but there is a selectbox and I need when an item selected in it datatable must post it as params and render datatable with new response
var tableObjects = $("#logTable").DataTable({
"bProcessing": false,
"bServerSide": true,
"sAjaxSource": "../../Controller/DashboardController.php5",
"aoColumns": [
{"mDataProp": "clientname" ,"sortable": false },
{"mDataProp": "clientip"},
{"mDataProp": "url","sortable": false },
{"mDataProp": "respsize"},
{"mDataProp": "loggingdate"},
{"mDataProp": "reqmethod"},
{"mDataProp": "resultcode"},
{"mDataProp": "duration"},
{"mDataProp": "hierarchycode"}
],
"fnServerData": function (sSource, aoData, fnCallback){
aoData.push({"name":"tablename","value":"dashboard"})
//after select an item in slcbox I add it as parameter so I need edit this party only..
debugger
$.ajax({
"dataType": "json",
"contentType": "application/json; charset=utf-8",
"type": "GET",
"url": sSource,
"data": aoData,
"success": function(result){
fnCallback(result);
},
error: function (xhr, textStatus, error){
debugger
if (typeof console == "object") {
console.log(xhr.status + "," + xhr.responseText + "," + textStatus + "," + error);
}
}});
},
"oLanguage": {
"sLengthMenu": '<select>' +
'<option value="5">5</option>' +
'<option value="10">10</option>' +
'<option value="20">20</option>' +
'<option value="30">30</option>' +
'<option value="40">40</option>' +
'<option value="50">50</option>' +
'</select> Show'
},
"fnCreatedRow": function( nRow, aData, iDataIndex ) {
});
},
"fnDrawCallback": function(){
},
"aaSorting": [
[2, 'asc']
],
"aLengthMenu": [
[5, 15, 20, -1],
[5, 15, 20, "All"] // change per page values here
],
"iDisplayLength": 5
})
I tried this so far, but of course it throws aoData undefined, fncallback undefined error.. it seems there must be other way to do it
$("#slcFilter").on("change",function(){
debugger
tableObjects.fnServerData ("../../Controller/DashboardController.php5", aoData, fnCallback)
{
aoData.push({"name":"tablename","value":"dashboard"})
debugger
$.ajax({
"dataType": "json",
"contentType": "application/json; charset=utf-8",
"type": "GET",
"url": sSource,
"data": aoData,
"success": function(result){
fnCallback(result);
},
error: function (xhr, textStatus, error){
debugger
if (typeof console == "object") {
console.log(xhr.status + "," + xhr.responseText + "," + textStatus + "," + error);
}
}});
}
});
解决方案
Add another aoData.push() that will add value of the selector to the data being sent to the server as shown below:
"fnServerData": function (sSource, aoData, fnCallback){
aoData.push({"name":"tablename","value":"dashboard"});
aoData.push({"name":"select","value":$("#slcFilter").val()});
// ... skipped ...
}
Then you need to call draw API method (if initialized with DataTable()) or fnDraw API method (if initialized with dataTable()) in the change handler for select element to re-draw the table and send a new request to the server.
$("#slcFilter").on("change",function(){
$("#logTable").draw(false);
});
这篇关于发布服务器参数并重新绘制新的源代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
