Search

Documented here: https://datatables.net/manual/server-side

Thanks! I tried really hard to find a similar post but couldn't! I will try to use allan's approach with clientSide processing and rows().add()

Just posted an answer to your question on Stack Overflow, cross-posting it here as well. SOLUTION Use dom option to manipulate markup for A feature and the rest of the table. Use custom CSS to modify appearance of the alphabet control. For example. JavaScript var table = $('#example').DataTable({ dom: '<"alphabet-container"A><"table-container"lfrtip>', alphabetSearch: { column: 0 } }); CSS .alphabet-container { float: left; width: 10%; } .table-container { float: left; width: 90%; } .alphabet-container .alphabet-info, .alphabet-container .alphabet-info-display { display: none } .alphabet-container .alphabet ul, .alphabet-container .alphabet li, .alphabet-container .alphabet a { display: block; } .alphabet-container .alphabet { margin: 0 15px 0 0; } EXAMPLE See this example for code and demonstration. LINKS jQuery DataTables AlphabetSearch - feature plug-in for the jQuery DataTables library that provides A-Z alphabetical search feature. See more articles about jQuery DataTables on gyrocode.com.

Thanks @allan it worked for me natural sorting plug-in

You can use columns.type and use num to sort your data numerically. For example: columnDefs: [ { targets: 0, type: 'num' } ] Replace 0 in targets: 0 with zero-based index of your column. See this example for code and demonstration. See more articles about jQuery DataTables on gyrocode.com.

Here is a sample of what I am trying: http://live.datatables.net/zuzotulo/2.

Solution : - using preXhr.dt event and recreate params correctly

:last as a selector would only work if it is inserted into the last position in the table. Perhaps a better option would be to select by id, which you should have access to in the json response. Allan

Yes - you can use the row-reorder event's arguments to do that: table.on( 'row-reorder', function ( e, details ) { var node = details.node; var row = table.row( node ); // etc } ); Allan

The reason Example 2 isn't working is the way Responsive shows the show / hide icons by default. It uses :first-child, but in that example the first column is actually hidden. It is kind of possible to select the first visible child, but its really quite ugly and it won't work in IE8 (which Responsive still supports). I'm not sure how to address that one yet. Example 1 appears to be more complicated. Responsive is hiding some columns, but it looks like it is calculating which ones to hide before the reorder, and then hiding them after the reorder, which really messes everything up. Compounding that the details view appears to be getting confused by the reorder. Its going to take a little while to untangle this I'm afraid. I suspect a new event will be required from ColReorder at a minimum. Allan