DataTables sorting on non-numeric column with input field -


i following datatables example add sorting on columns input field: http://datatables.net/examples/plug-ins/dom_sort.html

in code below, second targeted column (6), numeric field, , sorts fine, first column (5), text column, doesn't sort @ all. using chrome developer tools can see stepping function, no sorting takes place. both columns input fields. using latest datatables version, 1.10.7.

$.fn.datatable.ext.order['dom-text'] = function  ( settings, col ) {    return this.api().column( col, {order:'index'} ).nodes().map( function ( td, ) {       return $('input', td).val();    } ); }    var table = $("#example").datatable({    "scrolly": "500px",    "scrollx": "675px",    "scrollcollapse": true,    "paging": false,    "order": [],    "deferrender": true,    "orderclasses": false,    "columndefs": [      { "orderdatatype": "dom-text", "targets": [5,6] }     ]  }); 

solution

as in live dom ordering example, need use dom-text sorting <input> elements containing text , dom-text-numeric sorting <input> elements containing numbers.

/* create array values of input boxes in column */ $.fn.datatable.ext.order['dom-text'] = function  ( settings, col ) {     return this.api().column( col, {order:'index'} ).nodes().map( function ( td, ) {         return $('input', td).val();     } ); }  /* create array values of input boxes in column, parsed numbers */ $.fn.datatable.ext.order['dom-text-numeric'] = function  ( settings, col ) {     return this.api().column( col, {order:'index'} ).nodes().map( function ( td, ) {         return $('input', td).val() * 1;     } ); }  $(document).ready(function (){     $('#example').datatable( {         /* ... other options ... */         "columndefs": [             { "targets": 1, "orderdatatype": "dom-text-numeric" },             { "targets": 2, "orderdatatype": "dom-text", "type": "string" }         ]     } ); }); 

demo

see this jsfiddle code , demonstration.


Comments