Search

Hello, I am trying to enable multiple controls (header and footer same) with export buttons. If controls are only in footer buttons are working fine. See http://bambous.cz/DataTables/jb2.html When I enable controls for header as well [code]"sDom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>'[/code] buttons will disappear. See http://bambous.cz/DataTables/jb2-1.html Please advice. Thanks. Kvjetoslav

Hello, I am trying to implement TableTools and keep getting this jQuery error: "Type Issue 'undefined' is not an object (evaluating '$.extend') Issue (Image) can be seen here: http://kulersolutions.com/ls_images/error.png Any ideas?

First of all, awesome plugin. I can't believe how flexible DataTables is! Now for my problem: When using sSrollX, when I apply a solid 1px border so I can more clearly see the cells in a datatable, the horizontal scroll bar always appears (and it is slightly scrollable) even in cases when it shouldn't be there. As soon as I remove the border, the horizontal scroll bar disappears. Is there any way I can fix this? Thanks in advance!

Hi every one i am working on a project where i had to integrate knockout and datatables and i had to achieve CRUD operations using them... I have used knockout-datatables.js downloaded from this source https://github.com/CogShift/Knockout.Extensions my application is working properly but while iam performing rowlevel remove /edit..... which is similar to this example ( http://jsfiddle.net/ducka/haq2y/ ) the rowlevel event (example remove) will work only once... next if i have to make it work i have to either sort or use pagination i am not understanding why is it happening so ....can some one please help me Thank you :)

I am getting the following problem If one of the columns contains french characters it displays it like this -> Jan� Doe

Hi, For some reasons it has no effect to the "No matching records found" message even I modified the demo_table.css: .dataTables_empty { color: red; padding-left: 400px; } I found this post, but I am not sure if I edited the wrong spot. http://datatables.net/forums/discussion/7417/customize-no-matching-records-found-message-on-tables/p1 I tried to replace my demo.css to "jquery.dataTables.css" and it doesn't do anything too. table.dataTable td.dataTables_empty { color: red; text-align: right; } It is not like it doesn't work at all. It works if I modified the: "table.dataTable thead th", ".paging_full_numbers a.paginate_active", "table.dataTable tr.even" Has someone experience this issue before? Thanks.

Hi, I have searched high and low for an answer to my question but wasn't able to get a resolution to my question. I am trying to fit the datatable to fit inside a Google InfoWindow. Below is a snippet of code outlining how I approched to deal with this situationl [code] function drawTable(items,e) { var tmpStr = ""; var tmpStr2 = ""; var contentString = [ '<div class="tabs">', '<ul>', '<li><a href="#tab-1"><span>E. Coli Results</span></a></li>', '<li><a href="#tab-2"><span>Cyanobacteria + Microcystin Results</span></a></li>', '</ul>', '<div id="tab-1">', '<h1 style="color:red">' + beach_location + '</h1>', '<p>' + beach_region + '</p>', '<table class="data" id="ecoli_table" style="width:100%">', /* '<tr>', '<th>Sample Date</th>', '<th>Average E. coli Density <br/>(E. coli / 100 mL of sample)</th>', '<th>Recreational Water Quality Guideline <br/> (200 E. coli / 100 mL of sample)</th>', '</tr>' */ ].join(''); // add Ecoli Rows for (var j = 0; j < items.length; j++) { //console.log(items[j]); tmpStr = tmpStr + '<tr> <td>' + items[j][5] + '</td><td>' + items[j][6] + '</td><td>' + items[j][7] + '</td></tr>'; } //contentString = contentString + tmpStr + '</table></div></div>'; contentString = contentString + tmpStr + '</table></div>'; var contentString2 = [ '<div id="tab-2">', '<h1 style="color:red">' + beach_location + '</h1>', '<p>' + beach_region + '</p>', '<table class="data" id="algae_table" style="width:100%">', /* '<tr>', '<th>Sample Date</th>', '<th>Algase Toxin Microcystin</th>', '<th>Recreational Guideline 20ug</th>', '<th>Blue Green Algae Cells</th>', '<th>Recreational Guideline</th>', '</tr>' */ ].join(''); // add Algae Rows for (var j = 0; j < items.length; j++) { //console.log(items[j]); tmpStr2 = tmpStr2 + '<tr> <td>' + items[j][9] + '</td><td>' + items[j][10] + '</td><td>' + items[j][11] + '</td><td>' + items[j][12] + '</td><td>' + items[j][13] + '</td></tr>'; } contentString2 = contentString2 + tmpStr2 + '</table></div>'; contentString = contentString + contentString2 + '</div>'; infoWindow.setContent(contentString); infoWindow.setPosition(e.latLng); infoWindow.open(map); $(".tabs").tabs({ selected: 0 }); $("#ecoli_table").dataTable({ "sPaginationType": "full_numbers", "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]], "aaSorting": [[0, "desc"]], "bAutoWidth": false, "aoColumns": [ { "sWidth": "25px", "aTargets": ["_all"], "sTitle": "Sample_Date" }, { "sWidth": "25px", "aTargets": ["_all"], "sTitle": "Average_E._coli_Density" }, { "sWidth": "25px", "aTargets": ["_all"], "sTitle": "Recreational_Water_Quality_Guideline" } ], "bProcessing": true, /* "aoColumns": [ { "sTitle": "Sample_Date" }, { "sTitle": "Average_E._coli_Density" }, { "sTitle": "Recreational_Water_Quality_Guideline" } ] */ }); $('#algae_table').dataTable({ "sPaginationType": "full_numbers", "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]], "bAutoWidth": true, "bProcessing": true, "aaSorting": [[0, "desc"]], "aoColumns": [ { "sTitle": "Sample_Date" }, { "sTitle": "Algal_Toxin_Microcystin" }, { "sTitle": "Recreational_Guideline_20" }, { "sTitle": "Blue_Green_Algae_Cells" }, { "sTitle": "Recreational_Guideline" } ] }); } [/code] Any suggestions are greatly appreciated. Thanks in advance. Michael

I am considering using DataTables as a reporting tool and would like to allow users to create custom reports from the tables, save the setup for the report and then reload the report at a later time. Other that the state save functionality, is there something within DataTables, an extra or a plug-in that would allow me to do that? I'm thinking essentially it would require saving the DataTables objectand settings, plus any filters and/or column rearrangements that have been applied. Thanks for a great library!

I have a problem with including functions that editing , removig and creating rows. The code stops working when I declarate an 'editor' as an dynamic array.. ;/ Here's the code. Maybe someone will help :) [code] var editor; /* Data set - can contain whatever information you want */ var aDataSet = [ ['Trident','Internet Explorer 4.0','Win 95+',Math.floor((Math.random()*10)+1),'X'], ['Trident','Internet Explorer 5.0','Win 95+',Math.floor((Math.random()*10)+1),'C'], ['Trident','Internet Explorer 5.5','Win 95+','5.5','A'], ['Trident','Internet Explorer 6','Win 98+','6','A'], ['Trident','Internet Explorer 7','Win XP SP2+','7','A'], ['Trident','AOL browser (AOL desktop)','Win XP','6','A'], ['Gecko','Firefox 1.0','Win 98+ / OSX.2+','1.7','A'], ['Gecko','Firefox 1.5','Win 98+ / OSX.2+','1.8','A'], ['Gecko','Firefox 2.0','Win 98+ / OSX.2+','1.8','A'], ['Gecko','Firefox 3.0','Win 2k+ / OSX.3+','1.9','A'], ['Gecko','Camino 1.0','OSX.2+','1.8','A'], ['Gecko','Camino 1.5','OSX.3+','1.8','A'], ['Gecko','Netscape 7.2','Win 95+ / Mac OS 8.6-9.2','1.7','A'], ['Gecko','Netscape Browser 8','Win 98SE+','1.7','A'], ['Gecko','Netscape Navigator 9','Win 98+ / OSX.2+','1.8','A'], ['Gecko','Mozilla 1.0','Win 95+ / OSX.1+',1,'A'], ['Gecko','Mozilla 1.1','Win 95+ / OSX.1+',1.1,'A'], ['Gecko','Mozilla 1.2','Win 95+ / OSX.1+',1.2,'A'], ['Gecko','Mozilla 1.3','Win 95+ / OSX.1+',1.3,'A'], ['Gecko','Mozilla 1.4','Win 95+ / OSX.1+',1.4,'A'], ['Gecko','Mozilla 1.5','Win 95+ / OSX.1+',1.5,'A'], ['Gecko','Mozilla 1.6','Win 95+ / OSX.1+',1.6,'A'], ['Gecko','Mozilla 1.7','Win 98+ / OSX.1+',1.7,'A'], ['Gecko','Mozilla 1.8','Win 98+ / OSX.1+',1.8,'A'], ['Gecko','Seamonkey 1.1','Win 98+ / OSX.2+','1.8','A'], ['Gecko','Epiphany 2.20','Gnome','1.8','A'], ['Webkit','Safari 1.2','OSX.3','125.5','A'], ['Webkit','Safari 1.3','OSX.3','312.8','A'], ]; $(document).ready(function() { editor = new $.fn.dataTable.Editor( { "fields": [ { "label": "Nazwa (PL)", }, { "label": "Nazwa (ENG)", }, { "label": "Ilość osób", }, { "label": "Ilość osób", }, { "label": "", } ] } ); // New record $('a.editor_create').on('click', function (e) { e.preventDefault(); editor.create( 'Create new record', { "label": "Add", "fn": function () { editor.submit() } } ); } ); // Edit record $('#example').on('click', 'a.editor_edit', function (e) { e.preventDefault(); editor.edit( $(this).parents('tr')[0], 'Edit record', { "label": "Update", "fn": function () { editor.submit() } } ); } ); // Delete a record (without asking a user for confirmation) $('#example').on('click', 'a.editor_remove', function (e) { e.preventDefault(); editor.remove( $(this).parents('tr')[0], '123', false, false ); editor.submit(); } ); $('#dynamic').html( '' ); $('#example').dataTable( { "aaData": aDataSet, "aoColumns": [ { "sTitle": "Nazwa (PL)" }, { "sTitle": "Nazwa (ENG)" }, { "sTitle": "Ilość osób" }, { "sTitle": "Ilość osób", "sClass": "center" }, { "sTitle": "", "sClass": "center" }, { "sClass": "center", "sDefaultContent": 'Edit / Delete' } ] } ); } ); [/code]

With FixedHeaders i wanted to have the cloned header only to show when the original header was not visible. My config is top headers only I just updated the function in the plugin : _fnScrollFixedHeader ( around line 588 ) [code] // Lines where this._fnUpdateCache( oCache, 'sPosition', "absolute", 'position', nTable.style ); is fired this._fnUpdateCache( oCache, 'sDisplay', "none", 'display', nTable.style ); // Lines where this._fnUpdateCache( oCache, 'sPosition', 'fixed', 'position', nTable.style ); is fired this._fnUpdateCache( oCache, 'sDisplay', "block", 'display', nTable.style ); [/code] Thought i should share if someone is searching something similar Stefan :)