DataTables, JqueryUI, Length Drop Down, Search, Table Tools
DataTables, JqueryUI, Length Drop Down, Search, Table Tools
Ok so I have been trying to make this work and I have gotten very close. I have gotten Table Tools to work with the Jquery UI but when I put Table Tools in place it seems the drop down for the length of the table (Show 10, 20, 50, 100, etc) disappears. Is there a way that I can have all 3 working together?
I have tired to have all of these working together? The closest I have gotten is to have the search box along with the Table Tools, I cannot seem to get the length drop down to show up at all. I have tried the following scenarios.
1.) JQueryUI for the Table, NOT for TableTools - With this setup I get all items showing and workable however the header for my table from JQueryUI (where the search bar goes) is no longer there, it's just the components on a white background.
2.) JQueryUI for the table AND TableTools - With this setup I get to see the TableTools and the search box BUT NOT the length drop down to select how many rows to show. The JQueryUI looks fine, working perfect.
So my question is there a way I could have the best of both worlds?
Thanks,
Joseph Crawford
I have tired to have all of these working together? The closest I have gotten is to have the search box along with the Table Tools, I cannot seem to get the length drop down to show up at all. I have tried the following scenarios.
1.) JQueryUI for the Table, NOT for TableTools - With this setup I get all items showing and workable however the header for my table from JQueryUI (where the search bar goes) is no longer there, it's just the components on a white background.
2.) JQueryUI for the table AND TableTools - With this setup I get to see the TableTools and the search box BUT NOT the length drop down to select how many rows to show. The JQueryUI looks fine, working perfect.
So my question is there a way I could have the best of both worlds?
Thanks,
Joseph Crawford
This discussion has been closed.
Replies
I have tried to override and it is not working. here is my table init code:
[code]
$(document).ready(function() {
$('#reports').dataTable( {
"bJQueryUI": true,
"sDom": '<"H"Tfr>t<"F"ip>',
"oTableTools": {
"sSwfPath": "/swf/ZeroClipboard.swf",
"aButtons": [
"copy", "csv", "xls", "pdf",
{
"sExtends": "collection",
"sButtonText": "Save",
"aButtons": [ "csv", "xls", "pdf" ]
}
]
},
"aLengthMenu": [[10, 25, 100, -1], [10, 25, 100, "All"]],
"iDisplayLength": 100,
"iDisplayStart": 0
} );
} );
[/code]
I am unable to get the buttons to react to any of my settings. My install does not look like the default here: http://datatables.net/release-datatables/extras/TableTools/theme.html
Thanks,
Joseph Crawford
[code]
$(document).ready( function () {
$('#example').dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sDom": '<"H"lTfr>t<"F"Tip>',
"oTableTools": {
"aButtons": [
"copy", "csv", "xls", "pdf",
{
"sExtends": "collection",
"sButtonText": "Save",
"aButtons": [ "csv", "xls", "pdf" ]
}
]
}
} );
} );
[/code]
Allan
http://www.datatables.net/ref#iDisplayLength
bookmark that ref page. best page on the site.