Ajax sorting server-side, is iSortCol_0 considering hiddend columns?
Ajax sorting server-side, is iSortCol_0 considering hiddend columns?
max_favilli
Posts: 4Questions: 0Answers: 0
First of all, datatables are awesome!
I don't know if it's a bug, but I have a datatable+ajax with the following options:
[code]
"bServerSide": true,
"sAjaxSource": url,
"fnServerData": function (sSource, aoData, fnCallback) {
jQuery.ajax({
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
});
},
"sPaginationType": "bootstrap",
"aoColumns": [
{ "sName": "Id", "sType": 'numeric', "bVisible": false },
{ "sName": "PostingDate", "sType": 'Date' },
{ "sName": "Userid", "sType": 'string', "bVisible": false },
{ "sName": "DisplayName" },
{ "sName": "Description" },
{ "sName": "MainTag" },
{ "sName": "Tags" },
{ "sName": "HowMuch" }
]
[/code]
I have a form where users can add rows and when they submit it I add data to the database with an ajax call and then call:
[code]jQuery('#mydatatable').dataTable().fnReloadAjax(); [/code]
When a user click to sort the table by column "MainTag" my server-side ajax receives:
[code]
iSortCol_0 4
iSortingCols 1
[/code]
And all bSortable_# are there, correctly from 0 to 7 (I have 8 columns as shown above.
Now my problem is iSortCol_0 is misleading, since the columns where hidden, if I don't have a mean to know which columns are hidden on the server I misinterpret iSortCol_0=4 sorting by the wrong column.
I can implement a workaround, sending the information of which columns are displayed or hidden externally to datatables but I have the feeling either I am doing something wrong or I have missed to find the answer to my problem in the documentation.
Anyone can help? Please?
I don't know if it's a bug, but I have a datatable+ajax with the following options:
[code]
"bServerSide": true,
"sAjaxSource": url,
"fnServerData": function (sSource, aoData, fnCallback) {
jQuery.ajax({
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
});
},
"sPaginationType": "bootstrap",
"aoColumns": [
{ "sName": "Id", "sType": 'numeric', "bVisible": false },
{ "sName": "PostingDate", "sType": 'Date' },
{ "sName": "Userid", "sType": 'string', "bVisible": false },
{ "sName": "DisplayName" },
{ "sName": "Description" },
{ "sName": "MainTag" },
{ "sName": "Tags" },
{ "sName": "HowMuch" }
]
[/code]
I have a form where users can add rows and when they submit it I add data to the database with an ajax call and then call:
[code]jQuery('#mydatatable').dataTable().fnReloadAjax(); [/code]
When a user click to sort the table by column "MainTag" my server-side ajax receives:
[code]
iSortCol_0 4
iSortingCols 1
[/code]
And all bSortable_# are there, correctly from 0 to 7 (I have 8 columns as shown above.
Now my problem is iSortCol_0 is misleading, since the columns where hidden, if I don't have a mean to know which columns are hidden on the server I misinterpret iSortCol_0=4 sorting by the wrong column.
I can implement a workaround, sending the information of which columns are displayed or hidden externally to datatables but I have the feeling either I am doing something wrong or I have missed to find the answer to my problem in the documentation.
Anyone can help? Please?
This discussion has been closed.
Replies
I have exactly the same kind of problem:
I have a table with 4 columns (server-side). When initializing datatables, I set one column to be not visible (bVisible: false).
Rendering is going wel, since datatables hides this column indeed, so that's ok.
The problem is that when one sends a search request for a given column to the server, there is some discripency in the data being sent to the server between the number of columns parameters and the column to which the searched value is assigned.
Example:
- I have 4 columns in my table, and column #2 is hidden (counting from #0).
- I have search fields for each column
- I want to search column #3 (which is the last column)
- Datatables sends 4 sSearch values to the server (one for each column), but it puts the searched value in sSearch_2 instead of sSearch_3, because column #2 is hidden!
so:
- To keep it all consistent, I would expect to see the searched value being posted as sSearch_3, since Datatables keeps sending 4 mDataProp values and 4 sSearch values, even if column #2 is hidden. So why is the searched value sent as sSearch_2?
This may be by design (is it?), but what is "the neat way" to deal with this problem?
Thank you.
So in this case, how are you setting the column filtering? I suspect the issue is there, rather than in DataTables. You might find this plug-in API method useful: http://datatables.net/plug-ins/api#fnVisibleToColumnIndex
Allan
thanks for your answer.
I think I understand wat you mean now:
I was appending a per-column search box to each "tfoot th". I probably have to filter those on visibility, otherwise I will send the content of 4 per-column search fields instead.
Appending the per-column filters only to visible TFOOT TH's is not enough to solve this.
Datatables is still sending 4 column settings while only 3 are visible...
Any clue? What should I check?
[code]
sf.startMultiColumnSearch = function(node){
// clear alle search filters
oTable.fnFilterClear();
// collect data from all per-column fields
$("tfoot input").each(function(){
var oneSearchBoxValue = $(this).val();
/* Filter on the column (the index) of this element if string non empty */
if (jQuery.trim(oneSearchBoxValue)!='')
oTable.fnSetOneFilter( oneSearchBoxValue, $("tfoot input").index(this) );
});
// start search with collected multi-column filters
oTable.fnDraw();
};
[/code]
The part with ...$("tfoot input").index(this) is where is goes wrong I think. It assignes the wrong column number to the filter.
Rewritting the function hereabove did the trick.
Here is the new code, in which I implemented the function suggested by Allan.
Allan, again, thanks a lot!
[code]
sf.startMultiColumnSearch = function(node){
// clear alle search filters
oTable.fnFilterClear();
// collect data from all per-column fields
$("tfoot input").each(function(){
var oneSearchBoxValue = $(this).val();
/* Filter on the column (the index) of this element if string non empty */
if (jQuery.trim(oneSearchBoxValue)!='')
{
var trueColumnIndex = oTable.fnVisibleToColumnIndex( $("tfoot input").index(this) );
oTable.fnSetOneFilter( oneSearchBoxValue, trueColumnIndex );
}
});
// start search with collected multi-column filters
oTable.fnDraw();
};
[/code]