-
Feb
18thjQuery DataTables: How to Disable Sorting on a DataTable Instance
DataTables is a fantastic plug-in for the jQuery Javascript library that I use for pretty much all my web development projects. It is a highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table – in other words, it creates useful dynamic, with oodles of extra functionality, tables out of plain old vanilla HTML tables. Today’s question is how to disable sorting on a DataTable instance when it initializes. Turns out, this is pretty easy to achieve, simply by turning off the bSort property during the method call. In practice: Yup, pretty much as easy as that. (Note that you can further refine your sorting by turning bSort back on and making use of the aaSorting column definition.) Nifty.
-
May
28thHow to Refresh a DataTable without Losing Your Current Page or OrderingDataTables is a fantastic plug-in for the jQuery Javascript library that I use for pretty much all my web development projects. It is a highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table – in other words, it creates useful dynamic, with oodles of extra functionality, tables out of plain old vanilla HTML tables. Anyway, there is often a need to be able to refresh your datatable after applying some action to the source data, and the usual method of forcing a refresh is by calling the standard fnDraw() function on the table object. However, whilst this will redraw the table, it will basically reset you completely, removing any filtering and jumping back to page 1 if you have a table with pagination. So not ideal. Thankfully one of the DataTables forum guys came up with a handy bit of extension code which introduces a new function called fnStandingRedraw() which extends the datatables API and allows you to fresh the datatable without losing your current view. To implement, simply put the following code into a .js file and load it after you load the standard datatables.js library: Now on your page code, you can simply ask for a refresh by doing this: Nifty. Related Link: http://datatables.net/
-
May
16thjQuery DataTables: How to destroy a DataTable instanceI really do love the awesome DataTable plugin which creates useful dynamic, with oodles of extra functionality, tables out of plain old vanilla HTML tables. Today’s quick tip however looks at how one destroys an already instantiated DataTable instance, say because you want to recreate it at a later stage in a completely different format but want to reuse the selector currently bound to the existing table.
-
Feb
16thjQuery DataTables with Lots of Columns Crashes in IE
If you are using the brilliant jQuery DataTables plugin to present your data in nifty dynamic tables, and are using it in a server-side loading context, you have no doubt encountered the issue when a table with a lot of columns (more than 20) fails to load (in other words stays in “processing” mode) when browsing using Internet Explorer (IE).
-
Aug
16thjQuery DataTables: How to Force Specific Column WidthsToday’s tip looks at how you can specify what column widths to use in your DataTables implementation, instead of relying on the default auto column widths assigned by the plugin.
-
Aug
11thjQuery DataTables: How to Use jQuery ThemeRoller CSS Styling on Your Table
As a bonus, the awesome jQuery DataTables plugin (which I religiously use on all my work-related HTML tables nowadays) comes with the option to enable jQuery ThemeRoller styling with a simple switch of an initialisation parameter!
-
May
14thjQuery: Bind an onClick Event to an Item in a DataTables Row
Because the DataTables was being fed through a server-side script, in other words the actual table data is loaded by the DataTables plugin itself, my jQuery function that was supposed to interact with the clicking of a smiley face couldn’t work because the elements it was meant to interact with simply didn’t exist when the page’s initial DOM tree was being loaded.
-
Apr
19thHow to Disable Sorting on a Column in jQuery Datatables Plugin
Today’s quick tip is on how to disable sorting on specific columns, in the event when it simply doesn’t make sense for a user to be able to sort by that particular column in your table.
-
Apr
4thjQuery DataTables: How to Sort by a Specific Column on LoadWhen constructing your dataTable object you can pass it an initializer parameter named aaSorting which essentially allows you to set which columns to sort on and also which direction to sort in.
-
Mar
24thjQuery DataTables: How to Reload a Table’s DataOf course, I don’t usually work with static table data, meaning that I use server side processing scripts to load the data to my tables and when I started to employ user selectable data filters not connected to the DataTables object, I realised that I needed to be able to reload the DataTable’s data source at will.
-
Dec
11thjQuery: DataTables for smart TablesDataTables is a brilliant jQuery plugin that instantly adds a full set of advanced interaction controls over whatever HTML table it gets attached to. It’s flexible, well-coded and does the job in a fantastic manner, thereby lifting a lot of grunt work off any developer who doesn’t feel like creating table controls up from scratch any more.
