Quantcast
Viewing all articles
Browse latest Browse all 82146

using aaColumns and checkboxes...need help pls.

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:

//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 :/

Viewing all articles
Browse latest Browse all 82146

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>