DataTables 1.9.0 released

allan

Hello all,

I'm really excited to announce the release of DataTables 1.9.0! Having been in beta for the last two months you might have had the opportunity to play with some of the new features in 1.9 already, but as a quick summary:

- New $ and _ (underscore) API methods - these are used to run jQuery selectors on the table. The $ method gives you a jQuery object with the result based on the contents of the table, as if it were a single table (i.e. taking into account paging, filtering etc), while the _ method operates exactly the same way, but will give you the data for the matched rows / cells.

- Accessibility - DataTables tables are now fully accessible to screen readers and keyboard navigation out of the box. Making use of WAI-ARIA to ensure that everyone can enjoy using your highly dynamic and feature filled tables.

- Setting defaults - a feature long been lacking from DataTables, but it is now possible to set defaults for the initialisation of your tables. This comes as part of a significant reorganisation of the DataTables core.

- Documentation - Thanks to the wonderful JSDoc, almost every aspect of DataTables is now fully documented. Full documentation is available as part of the DataTables distribution now, and also available on this site. The automatically generated documentation is designed mainly for developers using complex DataTables options and plug-in authors. The documentation in the "usage" section of this site will remain with a focus for quick reference and new users, and will always refer to the current release version.

There are loads of other new features, rounding off of rough edges and bug fixes in 1.9.0, all of which make this a fantastic step forward for DataTables as a library and this project as a whole. For further information about what is new and available in this release:

- New features: http://datatables.net/new/1.9
- Upgrade notes: http://datatables.net/upgrade/1.9

So what's the downside? There isn't one! The minified file size of 1.9.0 is actually smaller than that of 1.8.2 (now standing at 68K minified, 20K gzip'd) and the API is backwards compatible with one exception: the state saving modification API has changed - see this blog post for further information: http://datatables.net/blog/localStorage_for_state_saving . Also note that your pagination CSS may need to be updated to take account of the new use of A tags for the pagination controls (see the upgrade notes for detailed information).

I'll be blogging about some of the new features and what can be done with them over the coming weeks, and I'm really excited to see how DataTables 1.9 is used!

Examples: http://datatables.net/examples/
Package download: http://datatables.net/releases/DataTables-1.9.0.zip

If you have any issues with the new release or upgrading from a previous version, please post your message in a new thread so we can keep track of individual issues.

Finally, please consider supporting DataTables by making a donation to the project. Your donations and support allow me to continue development and support of DataTables and keep the project moving forward:
http://datatables.net/donate

Enjoy!
Allan

sd_zuo

Is it possible to make a CHM documentation file?

sd_zuo

There's a problem when using the new 1.9.

Put Full Pagination option on,
Click on the numeric paging buttons,
A Javascript error will be thrown on IE8.
You can test it on this example page: examples\basic_init\scroll_y_theme.html

BTW,
The DataTable option asStripClasses has been changed to asStripeClasses, which, if was not a typo, should be considered as a breaking change and listed on the upgrade notes.

allan

Hi sd_zuo,

Thanks for the feedback!

> Is it possible to make a CHM documentation file?

I'm sure it probably is possible, however I've just done a quick search and I don't see a CHM output method for JSDoc, so that would need to be developed.

> Put Full Pagination option on [...]

Thanks for letting me know. The issue was that I was trying to blur the focus of an element that was no longer in the DOM. This only occurred in IE with full numbers paging, when clicking on one of the numbers and wasn't caught by the unit tests as it actually successes in the redraw (the blur was the very last thing to happen). i've reordered that code in order to prevent this error from occurring now and it is in the 1.9.1.dev nightly: http://datatables.net/download

> The DataTable option asStripClasses has been changed to asStripeClasses, which, if was not a typo, should be considered as a breaking change and listed on the upgrade notes

Excellent point - sorry I missed that. asStripeClasses has been supported for the last couple of major versions as the correct spelling but certainly this should be properly documented and now is. Thanks for flagging it up!

Regards,
Allan

sd_zuo

I had been sitting my ass on the chair when I saw the beta :P and had not downloaded or found the problems until the final version was out.
About the asStripeClasses issue maybe quite painful. I've been using DataTables from 1.7 but the documentation on your site had not point out that it was a typo and had been serving examples for the incorrect spell. Perhaps it is necessary to search and replace all misspelled occurrences on your site and maybe in the example files either.

Thank you Allan for the quick fix!

allan

I've made so many changes in 1.9 I'd forgotten about exactly what I had done with the stripe classes... There actually is code in 1.9.0 to try and support asStripClasses, however there is a bug in that code as the default for the correct spelling of asStripeClasses will then override whatever has been given by the incorrect spelling definition.

I've now correct this and both options will work as expected. asStripClasses (wrong spelling) is only deprecated in 1.9, it will work in the 1.9 series, although unfortunately due to a bug in 1.9.0 it doesn't in that release. 1.9.1 will address that!

All documentation and examples on the site should be up-to-date and the upgrade documents reflect that asStripClasses is deprecated.

Regards,
Allan

Andrew_Kaplanovsky

I think, there is a bug in jquery.dataTables.js, function _fnScrollDraw(o), Ln2897:

nScrollHeadInner.style.width = _fnStringToCss(iOuterWidth);

it should be

nScrollHeadInner.style.width = _fnStringToCss(iOuterWidth + o.oScroll.iBarWidth);

Otherwise when scoliing to the right, the column header are shifted a little bit

allan

Hi Andrew,

Thanks for flagging that up! That is most certainly a horrible little bit. I had actually been trying to solve a different issue there, but unfortunately I've inadvertently introduced this different issue. I'll get back to you shortly when I've got a suitable fix for both issues.

Regards,
Allan

mangia

Did anyone noticed some problems with upgrade ?

Do we need to take care about something ?

allan

@mangia: You should read the upgrade notes: http://datatables.net/upgrade/1.9 . If you notice any problems please open a new thread in the "DataTables 1.9" category with full details about the issues you are seeing including a working example showing the issue so I can find and fix it.

Thanks,
Allan

allan

@Andrew - I've just committed a fix for the scrolling issues that were present in 1.9.0. You can download the DataTables nightly from the download page: http://datatables.net/download . I've also added unit tests to make sure this doesn't happen again.

If you are able to let me know how it goes when you try the fix, that would be great (I'd like to make sure I get it completely right this time!).

Thanks,
Allan

John Archer

Hi Allan,

thanks for that great update. I am incorporating it into our application right now.

Regarding the new css code piece for two/full numbers (http://datatables.net/upgrade/1.9_full_numbers.css): Is is correct that I don't have to care for that changes when I am using themeroller and can go on using the css from 1.8.x?

Thanks a lot!

Regards

allan

Because the tags have changed from SPAN to A tags then there are a few small changes needed when using ThemeRoller - the demo stylesheet added a few enhancements to the ThemeRoller styles, so while for the most part it will automatically work, there might need to be a small amount of fine tuning.

The best reference for the base CSS is now the jquery.dataTable.css and jquery.dataTable_themeroller.css files: https://github.com/DataTables/DataTables/blob/master/media/css/jquery.dataTables_themeroller.css. You can see there how I've got a few styles for the full numbers style pagination.

Allan

John Archer

Ok, thank you!

valenpo

Allan, hello again! Thanks for best table ;)

When using DT 1.9 + Scroller + ServerSide i figure out that headers (when you have some fixed width) are blinking when table are draw, i fixed this by change

[code]nScrollHeadInner.style.width = "100%"; /* will be overwritten */[/code]

was 150% before.

this is init code

[code]
var resultTable = $( form.searchResult ).dataTable({
"bAutoWidth": false,
"bServerSide": true,
"sAjaxSource": "fetchtabledata.do?"+"instance=",
"bDeferRender": true,
"fnCreatedRow": function( nRow, aData, iDataIndex ) {
var cells = nRow.cells,
ch = $(cells[0]).text(),
at = $(cells[1]);
//add checkbox
$( cells[0] ).text("").html( $( '' ).attr( "checked", ( ch == 1 ) ? true:false ) );
//add attachment
if (at.text() == 1) {
at.html( "

allan

Can you try this with 1.9.1.dev from the downloads page please: http://datatables.net/download . I think it should be fixed in there.

Allan

valenpo

Have tried, results are same. Maybe it is because i have 60ms delay when loading and rendering data.
[code]nScrollHeadInner.style.width = "100%"; /* will be overwritten */[/code]
solve the issue. Also i cant understand in code, why need width = 150% ? if it any case overridden

allan

It was to allow the header to take the size it needs - but with the recent changes it probably isn't needed any more. Are you able to give me a link to a test page showing the issue? If I can recreate it and get the fix in for 1.9.1, that would be great.

Allan

valenpo

Problem is, we are restricted by NDA. But i can tell what exactly server script do the same things as on examples. But number of returned columns are 7

allan

Ah okay - no way to set up a simple demo showing the issue with http://live.datatables.net then? The thing is that the line "nScrollHead.style.overflow = "hidden";" should mean that the inner width can be sent to almost anything that it shouldn't matter.

Do you have width applied to the container of the table, or is it fluid width?

Allan

valenpo

It is all by default css (width: 100%), but internal script rewrite width to 150% on style, this cause for 0.5 seconds ( when huge data loading ) blinking of headers from 100% -> 150% -> 100%.

Also because ScrollerY make calculation of header width, and put it on style. bAutoWidth: false is not help, because i see scrollerY did it any case.

pendensproditor

I'd find it extremely useful to have a "bUseRendered" setting that applies to the entire table, just as you can apply sorting to an entire table with "bSort". I deal with tables filled with numbers that I format with commas, and I find that I almost never want "bUseRendered" to be true. I have to explicitly set it to false in many, many places.

jfirges

Hello Everyone,

I am new to Jquery datatables. I am currently using the latest release. I am having a difficult time getting the logic to transform my html table within my JSP page into a datatable. I have tried multiple methods to get this to work but have not had any success.

I am using Spring MVC 3.

I have attached the code below. Any help would be appreciated. I'm sure it is something I am missing.

Thanks in advance.

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

















$(document).ready(function(){
$('#userTable').dataTable({
"bJQueryUI":true
"sPaginationType":"full_numbers",
});
});













${user.userName}
${user.fullName}

|

allan

@valenpo: Thanks very much for the explanation! With that information I've successfully recreated the problem and I completely agree, the current behaviour is broken! I've just committed a suitable fix, which is currently available in the 1.9.1.dev nightly from the downloads page, and it will be in 1.9.1 when it is released at the end of the month.

@pendensproditor: You can use the following to do that:

[code]
"aoColumnDefs": [ {
"aTargets": ["_all"],
"bUseRendered": false
} ]
[/code]

("_all" is a "magic" parameter that will mean the column def will be applied to all columns).

@jfirges: I don't think your post directly related to the DataTables 1.9.0 release (unless I'm mistaken - did it work with 1.8.2?). Can you please post your question in a separate thread.

Regards,
Allan

sputnik

Hi,

In IE I'm getting the error: 'match(...).1' is null or not an object, when using the following code example from the sorting page...

jQuery.fn.dataTableExt.oSort['alt-string-desc'] = function (a, b) {
var x = a.match(/alt="(.*?)"/)[1].toLowerCase();
var y = b.match(/alt="(.*?)"/)[1].toLowerCase();
return ((x < y) ? 1 : ((x > y) ? -1 : 0));
};

It works fine in firefox.

It sounds similar to the problem found on the 1.7.1 release: http://www.datatables.net/forums/discussion/2581/datatables-1.7.1-released/p1

Thanks.

allan

@sputnik: Could you give a link to a test case page showing the problem please or at least run your table throughout he debugger and give us the debug code ( http://debug.datatables.net ).

Allan

sputnik

Thanks for your help.

This is the debug from firefox and IE 6 (which also has the problem)... for some reason my IE (8) crashes whenever I try to access a site outside our local network, so I'll post that when I can get it working. It works on 9, but most of users will be on 8 or 6.

Firefox: http://debug.datatables.net/avomuc
IE6: http://debug.datatables.net/ejobod

allan

Thanks for that. It actually looks like it should be working to me! From the debug trace don't understand why it isn't I'm afraid!

Could you possibly add:

[code]
console.log( a, b );
[/code]

to the top of your sorting functions and then post here what is shown on the console when you load the page?

Allan

sputnik

Thanks for that suggestion, I compared what the Firefox console was outputting and what IE was outputting to an alert and I noticed that IE wasn't putting any quotes on the alt attribute (It shows up in the debugs too.) I'm using .Net, so maybe the gridview control isn't being rendered properly... anyway I added single quotes inside my alt string and now it works.

Thanks for your help.

allan

Nice one - good to hear you've got it working.

Allan

sputnik

Just a note, this isn't actually a 1.9 problem now that I figure out what was going on. So I apologize for posting it here.