So here's some odd behavior that I don't know how to address.
I have a table with one standard column, one text input column, and varying numbers of checkbox columns.
I've scripted (server-side asp) to put into the javascript the right number of columns, and all looks well, except some odd results.
1. the normal column works perfectly.
2. the text input column works, but you must click the header twice to get it do do anything.
3. the checkbox colums have a similiar click issue, but seem to rotate the rows rather than actually sort them.
Here's my javascript code for the table (as delivered to the browser):
First, a direct cut-n-paste from the dom_sort example. (outside my &(document).ready function as seen below).
This is the code to initialize the table. The final two nulls are columns I don't sort on.
I've watched it through firebug, and it seems to call the function correctly, but I'm not great with Javascript, so following all the sorting algorithm is a bit over my head. I've tried reducing it down to just one checkbox & one text entry column, but that didn't seem to affect it.
Any help would be much appreciated.
Blessings,
Bill Fry.
I have a table with one standard column, one text input column, and varying numbers of checkbox columns.
I've scripted (server-side asp) to put into the javascript the right number of columns, and all looks well, except some odd results.
1. the normal column works perfectly.
2. the text input column works, but you must click the header twice to get it do do anything.
3. the checkbox colums have a similiar click issue, but seem to rotate the rows rather than actually sort them.
Here's my javascript code for the table (as delivered to the browser):
First, a direct cut-n-paste from the dom_sort example. (outside my &(document).ready function as seen below).
/* Create an array with the values of all the input boxes in a column */ $.fn.dataTableExt.afnSortData['dom-text'] = function ( oSettings, iColumn ) { var aData = []; $( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () { aData.push( this.value ); } ); return aData; } /* Create an array with the values of all the select options in a column */ $.fn.dataTableExt.afnSortData['dom-select'] = function ( oSettings, iColumn ) { var aData = []; $( 'td:eq('+iColumn+') select', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () { aData.push( $(this).val() ); } ); return aData; } /* Create an array with the values of all the checkboxes in a column */ $.fn.dataTableExt.afnSortData['dom-checkbox'] = function ( oSettings, iColumn ) { var aData = []; $( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () { aData.push( this.checked==true ? "1" : "0" ); } ); return aData; }
This is the code to initialize the table. The final two nulls are columns I don't sort on.
$(document).ready(function() { var rTable = $('#tblRoles').dataTable( { "sDom": '<"H"f>t<"F">', "bJQueryUI": true, "bPaginate": false, /* turn of pagination for this list. */ "aoColumnDefs": [ { "bSearchable": false, "bSortable": false, "aTargets": [ 11, 12 ] }, ], "aoColumns": [ null, { "sSortDataType": "dom-text" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, { "sSortDataType": "dom-checkbox" }, null, null ], "aaSorting": [[0, 'asc']] });
I've watched it through firebug, and it seems to call the function correctly, but I'm not great with Javascript, so following all the sorting algorithm is a bit over my head. I've tried reducing it down to just one checkbox & one text entry column, but that didn't seem to affect it.
Any help would be much appreciated.
Blessings,
Bill Fry.