Search

For posterity, I see that as of DataTables 1.5.2, the function fnSetColumnVis hides additional rows in thead. So the problem I was having with an earlier version (see post above from Aug 11th 2009) has been solved! In the interim period, I was hiding columns by setting the CSS visitiblity property to "collapse". This worked fine (even with pagination turned on) in Firefox, but Safari (and some other browsers) do not support column "collapse". The DataTables function does work in Safari and Firefox. Thanks Allan (and anyone else who may have contributed to this improvement). Jared

Hi, $('table.grid').dataTable({"bPaginate": false,"bSortClasses":false,asStripClasses:[]}); and it works really much faster. Thanks

sorted

Link to test case: https://jsfiddle.net/d2q469uy/ Debugger code (debug.datatables.net): - Error messages shown: No errors Description of problem: As soon as I include the scroller extension (I don't need it in the example, but in the real script), no more entries are displayed in the SearchPanes after a certain line number (when using the button initialization). But the scrollbar suggests that there are many more. If I search for e.g. "Tiger Nixon 175", the entry is displayed. Without a search entry, "Tiger Nixon 175" is missing in the list. Also, there is a 0 at the end of each filter list.

I connected my system with database consists of millions of data. However, the system keeps lagging once connecting. So, I plan to use the serverside processing to initialize the table to empty table so it no need to process all the data in a time (and lag). Not sure if it's a good way to deal the heavy data with the datatable. Here is my what I tried but it didnt work, <script type="text/javascript"> $(document).ready(function(){ fill_datatable(); function fill_datatable(age = '', age2 ='' ,dataGender = '') { var dataTable = $('#table_data').DataTable({ processing: true, serverSide: true, " iTotalRecords": 57, "iTotalDisplayRecords": 57, },

I'm a novice programmer that is using DataTables on a Google Site, and its perfect on the desktop site. When the site is loaded on a mobile device, either in Safari or Chrome, none of the columns are selected every time the site is opened. Any thoughts on this?

when we initialize the data table then only 3 rows it allows to expend from the 4 row it shows the error like Uncaught TypeError: Cannot read property '_detailsShow' of undefined at _Api. (jquery.dataTables.js:8377) at Function.isShown (jquery.dataTables.js:7197) at HTMLTableCellElement. (

I encounter strange behavior of datatables with responsive. When I provide column titles with basic rows, all looks ok. But i have key data in 0 column, so I need hide it, so I add columnDefs, and hide 0 column. After that, all columns are not responsive... Some one knows how to use this component? I see that topic is duplicated, how to remove this one?

I have configured datatable as below: function BindDataTable(targetGrid) { var sortableGrid = $(targetGrid).attr('id'); var DT = $('#' + sortableGrid).dataTable({ "fnInitComplete": function () { $('#' + sortableGrid + ' thead > tr').removeClass().addClass("HeaderGridView2").css('cursor', 'pointer'); $('#' + sortableGrid + ' tfoot > tr').removeClass().addClass("FooterGridView2"); }, "bPaginate": false, "bLengthChange": false, "bFilter": false, "bSort": true, scrollY: '500px', "bInfo": false, "bScrollCollapse": true, "bAutoWidth": false, "asStripClasses": null, //To remove "odd"/"event" zebra classes "fnDrawCallback": function () { $('#' + sortableGrid + ' tr').removeClass(); $('#' + sortableGrid + ' tr:even').addClass("RowGridView2 even"); $('#' + sortableGrid + ' tr:odd').addClass("AlternatingRowGridView2 odd"); $('#' + sortableGrid + ' thead > tr').removeClass().addClass("HeaderGridView2").css('cursor', 'pointer'); $('#' + sortableGrid + ' tfoot > tr').removeClass().addClass("FooterGridView2"); } }); } But when the datatable gets binded and displayed first time it does not gets display properly as header and footer not set as per column width. After click on any column to sort table it gets displayed as expected with property header and footer as in below screen. Why does this happens?

1> I create query-entry text box in tfoot on interface A, shown below $('#example tfoot th').each( function () { var title = $(this).text(); $(this).html( '' ); } } ); var table = $('#example').DataTable({ "order": [[ 0, "desc" ]], "scrollX": true, "processing": true,"bLengthChange":false, "paging": true,"serverSide": true, "ajax":{ url:"j_getdata" }, "columns" : [{"data" : "id",}}, {"data" : "pic","name":"pic"}] }); 2> datatables runs well on interface A, and I need jump to interface B with the query parameters, when I return to interface A from interface B, I need put the query parameters into the query-entry text box ,and query data from database with ajax.I tried many ways, but I can't finished this work well. I use the code below, it can realize the function. But it obviously is bad, because datatables will load data three times, Then I use callback function,but I failed. $("tfoot input").each( function (i) { switch(i) { case 0: this.value='${q_id!}'; break; case 1: this.value='${q_pic!}'; break; } table.columns(i).search(this.value); table.draw(); } ); could you help me ,any suggest would be appreciate. I think the better way is set the query parameters into datatables before it load data from server. I don't know how can I do that, BTW, I get the query parameters with java code --- request.getParameter("columns[0][search][value]"); help~~~~~~~~~