Create aoColumnDefs options with a loop

cfdltech

I'm treating the entire dataTable option as an object like so

[code]
var opt = {
"sPaginationType": "bootstrap",
"oLanguage":{
"sSearch": "",
"sLengthMenu": "Limit: _MENU_"
},
"aoColumnDefs": [
{"bVisible": false, "aTargets": "" }
]
};

[/code]

and then I grow the object by continually adding the options I want.

[code]

if($(this).hasClass('dataTable-tools')){
opt.sDom= 'T<"clear">lfrtip';
opt.oTableTools = {
//"sSwfPath": "js/tableTools/swf/copy_csv_xls_pdf.swf"
"aButtons": [
"print"
]
};

}


[/code]

This allows me to control the options with classes on the tables. So, I want to set a table attribute with a csv of column numbers to hide and feed that into my aTargets. The problem is I keep getting the warning:

DataTables warning (table id = 'DataTables_Table_0'): aTargets must be an array of targets, not a string

I'm feeding the csv to my javascript and pushing to my object like so:

[code]

if($(this).hasClass("dataTable-clickable")){

// this is a custom attrbute on my table that has hidden-cols='1,2,3,4'
var hc = $(this).attr("hidden-cols");
var hc_array = hc.split(",");

opt.aoColumnDefs.push({"bVisible": false, "aTargets": [hc_array] });

}

[/code]

The code below appears to work if I either hardcode a number or a variable for the aTargets:

[code]

var col = 1;
opt.aoColumnDefs.push({"bVisible": false, "aTargets": [col] });

[/code]


How do I push an array into the aTargets?

cfdltech

Sorry, bad title. I just caught it. I've been thinking in terms of loops that I initially was using a for loop to loop through my csv and push each new node. Instead, since the aTargets takes an array only 1 call to bVisible is needed.

cfdltech

Ok, where I declare my aoColumnDefs initially I set

[code]
"aoColumnDefs": [
{"bVisible": false, "aTargets": "" }
]

[/code]

it should be

[code]

"aoColumnDefs": [
{"bVisible": false, "aTargets": [] }
]

[/code]

This gets rid of the warning because I was initially declaring the aTarget as a string.


Now, this works:

[code]

var col = new Array(1,2,3,4);
opt.aoColumnDefs.push({"bVisible": false, "aTargets": col });

[/code]

But when I split a csv string it does not:

[code]

var hc = $(this).attr("hidden-cols");
var hc_array = hc.split(",");
opt.aoColumnDefs.push({"bVisible": false, "aTargets": hc_array });

[/code]

Is there a fix for this?

allan

> opt.aoColumnDefs.push({"bVisible": false, "aTargets": hc_array });

So you get an error about aTargets not being an array there? In which case I'd suggest you `console.log( hc_array )` and see what it is. If it's not an array (it looks like it should be), then that's the issue.

Allan

cfdltech

[code]

Array[4]
0: "1"
1: "2"
2: "3"
3: "4"
length: 4

[/code]


hc is getting populated with 1,2,3,4 and after the split the above is what the console shows for hc_array. It's coming from the split which makes an array.

The aTargets error has gone away when I removed the quotes from where I initialized the aoColumnDefs object in order to make it available to push to. That got rid of the aTargets needs an array. Sorry to be confusing.

The problem now is that I can't feed the hc_array into the aTargets but I can do an array I create in code.

cfdltech

Thanks Allan. That put me on the right track. It did have to do with hc_array not being what I thought it was. I could have sworn I had already played around with parseInt but I needed to convert the string to int and it appears to be working.

Here's my full code

HTML table
[code]



[/code]

Javascript

[code]

if($(this).hasClass("dataTable-clickable")){

var hc = $(this).attr("hidden-cols");
var hc_array = hc.split(",");

for(var i=0, len=hc_array.length; i