Search

This is my code, and working fine: [code]jQuery(document).ready(function() { var oTable = jQuery('#example').dataTable( { //"sScrollY": "100%", //"sScrollX": "100%", "bFilter": true, "bAutoWidth": false, "sPaginationType": "full_numbers", "sDom": '<"top"ifTlp<"clear">>rt<"bottom"ilp<"clear">>', "oTableTools": { "sSwfPath": "/media/swf/copy_csv_xls_pdf.swf", "aButtons": [ { "sExtends": "csv", "sButtonText": "Guardar CSV" }, { "sExtends": "xls", "sButtonText": "Guardar para Excel" } ] }, "aLengthMenu": [[10, 25, 50, 100,-1], [10, 25, 50, 100,"Todos"]], "bStateSave": false, "bSort": false, "bServerSide": true, "bProcessing": true, "sServerMethod": "GET", "sAjaxSource": ajaxurl+'?action=getViaticos', // The AJAXURL is for Wordpress Action Hook. } ); } );[/code] But I don't know how to set the order for the first column (ID column). I tried with aaSort but, no works. Anybody can help me?

Step 1: extend dataTableExt.oSort with the following code: [code] $.extend($.fn.dataTableExt.oSort, { "numeric-pre": function(a) { a = (a === "-" || a === "") ? 0 : a.replace(/[^\d-.]/g, ""); return parseFloat(a); }, "numeric-asc": function(a, b) { return a - b; }, "numeric-desc": function(a, b) { return b - a; } }); [/code] Step 2: extend dataTableExt.aTypes, add comma to sValidChars variable: [code] # Added comma to sValidChars $.extend $.fn.dataTableExt.aTypes, [ /* * Function: - * Purpose: Check to see if a string is numeric * Returns: string:'numeric' or null * Inputs: mixed:sText - string to check / function (sData) { / Allow zero length strings as a number */ if (typeof sData === 'number') { return 'numeric'; } else if (typeof sData !== 'string') { return null; } var sValidFirstChars = "0123456789-"; var sValidChars = "0123456789.,"; var Char; var bDecimal = false; /* Check for a valid first char (no period and allow negatives) */ Char = sData.charAt(0); if (sValidFirstChars.indexOf(Char) == -1) { return null; } /* Check all the other characters are valid */ for (var i = 1; i < sData.length; i++) { Char = sData.charAt(i); if (sValidChars.indexOf(Char) == -1) { return null; } /* Only allowed one decimal place... */ if (Char == ".") { if (bDecimal) { return null; } bDecimal = true; } } return 'numeric'; }, /* * Function: - * Purpose: Check to see if a string is actually a formatted date * Returns: string:'date' or null * Inputs: string:sText - string to check */ function (sData) { var iParse = Date.parse(sData); if ((iParse !== null && !isNaN(iParse)) || (typeof sData === 'string' && sData.length === 0)) { return 'date'; } return null; }, /* * Function: - * Purpose: Check to see if a string should be treated as an HTML string * Returns: string:'html' or null * Inputs: string:sText - string to check */ function (sData) { if (typeof sData === 'string' && sData.indexOf('<') != -1 && sData.indexOf('>') != -1) { return 'html'; } return null; } ]); [/code] http://stackoverflow.com/a/16129840/888737

Thanks for such a nice JS plugin. I am using DataTables in a page where on selecting the row, it displays the details of the selected row below the DataTable. This is working perfectly fine. However I have a requirement that when user comes to this page. The first row must be already selected and the details of the row must be visible. I already have a click event for row selection and I somehow wants to invoke that method when the page is loaded. Below is sample click event [code] $("#tbl-example tbody tr") .live( "click", function(e) { var originalScrollPosition = $( ".dataTables_scrollBody") .scrollTop(); aPos = oTable.fnGetPosition(this); if (fi_pageEdit) { if (previousEditedRow == aPos) { if (previousEditedRow != lastRowCancelled) { return; } lastRowCancelled = null; } else { if (previousEditedRow != undefined) { if (fi_isDirty) { showDirtyDialogue(); return; } else { colChangedArray = []; var oldRowData = oTable .fnGetData(previousEditedRow); revertCurrentRow(oldRowData[7]); } } } } performClick(this); $(".dataTables_scrollBody").scrollTop( originalScrollPosition); }); [/code]

Disregard. wrong question :)

Hi there! Just wondered if this was possible? Basically I want to have complete control over the position of the filtering elements so I can render them inside another div element on the page. Thanks

trying to set some defaults. I guess I'm doing

two different sets of defaults for datatables. right now

I have a multi-column table where I can filter three of these columns using fnFilter, fnGetColumnData with a case-insensitive sort. (What a great set of community-supplied resources!) What I would like to do is to be able to click on a cell in one of these columns and have the value in that cell become the content in the appropriate filter drop-down box, causing a table redraw with only those rows matching that value to be displayed. The drop-down box would still maintain the full list of possible values so that the user could cancel the filter by selecting the first, blank one.

Is there any way to programmatically set data length in pagination control?

format once as a default and not for every