I am new at this and have been trying to figure out what I am doing wrong here but it seems I need some help figuring this out. I'll be honest here, this plugin confuses the heck out of me so I really dont know what I am doing but here is what I am having an issue with. I have a table set up that has a column with checkboxes in it and another column with images.
I need to be able to sort the images by their alt tag as well as be able to submit a form that will get all the values of the checked checkboxes...
I have the image sorting figured out but when i add the checkboxes to the table, it breaks the table and nothing works...here is what I mean:
this works fine and I can sort the image column by their alt tags:
However, when I add the code below in order to get the checkbox values, it breaks the table completely (CSS and everything stops working):
Now, if I take out the aaColumns code, the checkboxes work fine but then I can't sort the image columns...
how can I set this up so i can do both? If you can provide code with your answer that will help, like I said I don't really understand how to use this plugin properly :/
I need to be able to sort the images by their alt tag as well as be able to submit a form that will get all the values of the checked checkboxes...
I have the image sorting figured out but when i add the checkboxes to the table, it breaks the table and nothing works...here is what I mean:
this works fine and I can sort the image column by their alt tags:
//make the images column sortable jQuery.extend( jQuery.fn.dataTableExt.oSort, { "alt-status-pre": function ( a ) { switch(a.match(/alt="(.*?)"/)[1].toLowerCase()){ case 'request': return 1; case 'pending': return 2; case 'approved': return 3; default: return 4; } }, "alt-status-asc": function( a, b ) { return ((a < b) ? -1 : ((a > b) ? 1 : 0)); }, "alt-status-desc": function(a,b) { return ((a < b) ? 1 : ((a > b) ? -1 : 0)); } } ); $(document).ready(function() { $('#products').dataTable( { "aoColumns": [ null, null, null, null, null, { "sType": "alt-status" } ] } ); } );
However, when I add the code below in order to get the checkbox values, it breaks the table completely (CSS and everything stops working):
$('#requestform').submit( function() { var sData = $('input', oTable.fnGetNodes()).serialize(); alert( "The following data would have been submitted to the server: \n\n"+sData ); return false; } ); oTable = $('#products').dataTable( { "aoColumns": [ null, null, null, null, null, { "sType": "alt-status" } ] } ); } );
Now, if I take out the aaColumns code, the checkboxes work fine but then I can't sort the image columns...
$('#requestform').submit( function() { var sData = $('input', oTable.fnGetNodes()).serialize(); alert( "The following data would have been submitted to the server: \n\n"+sData ); return false; } ); oTable = $('#products').dataTable(); } );
how can I set this up so i can do both? If you can provide code with your answer that will help, like I said I don't really understand how to use this plugin properly :/