Couple questions re: DataTables

dparkmit

Hi Allan,

Thank you for your awesome jquery plugin! I have a couple questions regarding the use of DataTables.

1. How do you remove the text "Search: " next to the filtering field? I want to use the filtering field and to also preserve its state. But I'd like to remove the "Search: " text

2. How do you change the behavior of the sortable columns so that the sort order is set to DESC when the user clicks on the column header for the first time? By default, the sort order is set to ASC when the user clicks on the column header for the first time. I'd like to change it so that the initial sort order is DESC and then the sort order becomes ASC when the user clicks on the column header for the second time.

David

allan

Hi David,

1. The search text can be customised using this parameter: http://datatables.net/usage/i18n#oLanguage.sSearch . So to do what you are looking for and not have any text, just set it to an empty string:

[code]
$(document).ready(function() {
$('#example').dataTable( {
"oLanguage": {
"sSearch": ""
}
} );
} );
[/code]

2. The order in which the sorting is applied is controlled using the asSorting parameter for the individual columns: http://datatables.net/usage/columns#asSorting . By default it is [ 'asc', 'desc' ], but you can readily set it to be the inverse of that to have the operation you want. This can be controlled on a per column basis, or if you wish you can set it for all columns like this:

[code]
$(document).ready(function() {
$('#example').dataTable( {
"aoColumnDefs": [
{ "asSorting": [ "desc", "asc" ], "aTargets": [ "_all" ] }
]
} );
} );
[/code]
Note that you will probably want to use aaSorting ( http://datatables.net/usage/options#aaSorting ) to set the initial sorting state to desc as well - otherwise the default sorting will still be applied.

Hope this helps :-)

Regards,
Allan

dparkmit

Thanks Allan! Your plugin is really amazing! I'm going to send you a link to our new site when we launch it. I think that you'll get a kick out of how we've applied DataTables. :)

allan

Fantastic! I look forward to seeing it :-)

Regards,
Allan

dparkmit

Hi Allan,

I have one followup question. I'd like to change the way in which full_numbers pagination works. Below is a description of how I'd like to change pagination. Can you please let me know if this is possible and how to do it?

Ideal Pagination
1. "First", "Last", "Previous" and "Next" links aren't visible if the total number of pages is less than or equal to 5.
2. "First", "Last", "Previous" and "Next" links are visible if total number of pages is greater than 5
3. "First" and "Previous" links have special styling to show that it's active if the user is on page 1
4. "Last" and "Next" links have special styling to show that it's active if the user is on last page.

Thanks!
David

dparkmit

Hi Allan,

Here's another question for this thread. I set bStateSave to "true". And it seems to correctly save the filtering and column sorts. But it doesn't save the pagination information. Do you know what I might be doing wrong? FYI, I've enabled full_numbers type pagination.

David

allan

Hi David,

Regarding the pagination styles - what it is possible to do is have a plug-in which will do exactly what you are looking for. There isn't one which will do exactly that at the moment, but there are a number of plug-ins which you could use as a basis for your custom controls:

http://datatables.net/plug-ins/pagination
http://datatables.net/examples/plug-ins/paging_plugin.html

With regard to the state saving - I'm not entirely sure what the problem would be I'm afraid. If you have a look at this demo: http://datatables.net/examples/basic_init/state_save.html - the pagination seems to be retained okay (it's using the base paging style, but there should be no difference on behaviour). Are you doing a redraw after initialising the table perhaps?

Allan

dparkmit

Hi Allan,

Thanks for your comments. Here is the URL for the development server that I'm using now. http://dp.www.beatthegmat.com/mba/category/tags/gmat-math/algebra

If you go to the page, you'll see that DataTables successfully saves state for the filter and the sorting. But it doesn't save state for the pagination.

Do you know what we might be doing wrong?

Thanks again for this amazing jQuery plugin!

David

allan

Hi David,

I'm afraid I don't see anything obvious from looking at your code - it all looks perfectly reasonable! So I wonder if you could possibly change your DataTables include to load Javascript from here for a short while: http://datatables.net/dev/dparkmit.dataTables.js ? That would allow me to put a few debug statements into DataTables to see what is going on.

Thanks,
Allan

dparkmit

Hi Allan,

Thanks so much for the quick response and the help! I just changed the Javascript include line so that the page loads the Javascript file from http://datatables.net/dev/dparkmit.dataTables.js

David

allan

Getting a PHP error at the moment: btg-bookmarks.php line 43 :-)

Allan

dparkmit

Sorry! It's been fixed now.

allan

Brilliant - thanks for that. It was a bug in DataTables when using state saving in combination with Ajax sourced data :-( . The DataTables file you've linked to has the fix in it - if you could take a copy of it so I can remove the file from this server that would be great. This will either go into 1.8 or 1.7.7 if I decide to do that (not sure yet!).

Thanks for the help in tracking this down.

Regards,
Allan

dparkmit

Thanks for the fix Allan! It works. I also copied the file from your server onto our dev server. So you can delete the file.

By the way, what did you think of our implementation? We'll be launching the new site next week on our production environment.

dparkmit

Hi Allan,

I'm sorry but the state saving seems to be broken again. Sometimes, DataTables saves all the state correctly. But on other times, DataTables doesn't save any state at all now. FYI, I'm using the latest file that you gave me.

Can you please check it out? Thanks!

David

allan

Hi David,

Interesting - I wonder if you might be hitting the 4KiB cookie limit? What DataTables will do when that limit is approached is to remove old cookies belonging to it, rather than keeping on adding more cookies, which will result in a server error being reported. The way to check that if this is the case is to add a debug alert (or console.log) just after _fnCreateCookie - line 6072 "if ( iLength+10 > 4096 )" which says that a cookie is being removed. This will happen when you bounce between multiple tables.

The way around this is to implement state saving with server-side interaction. Unfortunately the 4KiB limit is hard and there is nothing that can be done about it. We'd need to find a different way (HTML 5 local storage perhaps). Although this is assuming that this is the problem - probably worth finding out first :-)

Also I really like the implementation you've got! You've obviously spent a good deal of time integrating DataTables with your site and I think it looks superb - nice one :-)

Regards,
Allan

dparkmit

Thanks for the advice and the compliment Allan! We couldn't have made our table of contents without your awesome plugin.

By the way, what is the cookie named? Also, why is the cookie exceeding 4K? I'd assume that the amount of data that needs to be stored would be fairly small (e.g., sorting, filtering and pagination). Is the cookie getting long because DataTables creates a new cookie for each individual table?

allan

The cookie name can be controlled by this parameter: http://datatables.net/usage/options#sCookiePrefix . You are quite right that a different cookie is used for each different page. Remember that the 4KiB limit is for all cookies on the page combined, not each individual one. I find that you tend to get about 8 table states stored before older cookies are over written - it should always delete the oldest first and only delete DataTables controlled cookies.

Sticking in those debug statements would confirm that this is indeed what is happening :-)

Regards,
Allan

hpacheco

Hi Allan,

I got several tables in the same page, in separate tabs and I was thinking about using the same settings for all the tables - they would share the same cookie..

In _fnSaveState you use oSettings.sInstance to create the cookie name based on the table name, how do you recon I could override that and get all the tables to save/load from the same cookie?

Thanks,

Hugo

allan

Hi Hugo,

It would probably be worth starting a new thread for your question, since it's a bit different from the original, but no worries :-)

I'm not sure that sInstance will do the trick since it is unique for every table. However, putting a change into _fnSaveState and _fnLoadState to have everything use the same cookie would certainly do it. It would mean that if you filter on one table and refresh, they would all be filtered - is that what you want? http://datatables.net/plug-ins/api#fnFilterAll might be of interest (although I think you'd need to create something similar for sorting etc).

Allan

hpacheco

Hi Allan,

"It would mean that if you filter on one table and refresh, they would all be filtered - is that what you want?"

That's exactly what I want. I'll have a look at _fnSaveState and _fnLoadState, been really busy lately that's why I haven't replied before.

I'll post the results when I'm done.

Thanks,

Hugo