1

I'd like to create the following JSON data for DataTables parameter aoColumnDefs:

var aryJSONColTable = [
                        {"sTitle": "Column00", "aTargets": [0]},
                        {"sTitle": "Column01", "aTargets": [1]},
                        {"sTitle": "Column02", "aTargets": [2]},
                        {"sTitle": "Column03", "aTargets": [3]}
                      ]

Then I will put the variable into my DataTable variable declaration like following:

var oTable = $('#report').dataTable({
                                "aoColumnDefs": aryJSONColTable,
                                "bProcessing": true,
                                "bServerSide": true,
                                "bLengthChange": true,
                                "bFilter": true,
                                "aaSorting": [[ 3, "desc" ]],
                                "sScrollX": "100%",
                                "bScrollCollapse": true,
                                "bJQueryUI": true,
                                "sAjaxSource": "./getDataEA.php"
                            });

Based on this useful discussion, I have tried a JavaScript loop to create the JSON data aryJSONColTable as follow:

//create JSON array for aoColumnDefs
var aryColTableChecked = ["column00", "column01", "column02", "column03"];
var aryJSONColTable = [];

for (var i in aryColTableChecked) {
    aryJSONColTable.push({
                      "sTitle": aryColTableChecked[i],
                      "aTargets": [i]
                    });
};

I always get value "1" for data "aTargets" from above JavaScript loop, which I wish to get value [running_index_number] for data "aTargets".

Please kindly assist me on this matter. Thank you in advance.

Community
  • 1
  • 1
dnugroho
  • 41
  • 2
  • 8

2 Answers2

1

for...in is for objects not arrays and aryColTableChecked is an array. You can do it like this:

var arr = [];
var max = 3; // zero based
for (var i = 0, n; i <= max; i++) {
    n = i > 9 ? '' + i : '0' + i; // make sure it has 2 digits
    arr.push({
        sTitle: 'Column' + n,
        aTargets: [i] // why array here?            
    });
}
elclanrs
  • 92,861
  • 21
  • 134
  • 171
  • +1: I think the question "*Why array here?*" is the real problem. – Bergi Sep 07 '12 at 03:55
  • I think you want either `max = 4` or `i <= max`. – nnnnnn Sep 07 '12 at 03:58
  • Cool. Another thing: I just noticed you've used `i.length` - does that work when `i` is a number? (IE gave me `undefined` for `i.length` so I'd use `i > 9`.) – nnnnnn Sep 07 '12 at 04:08
  • Works for me here http://jsfiddle.net/reZrR/ in Chrome but I'll do what @bergi suggested – elclanrs Sep 07 '12 at 04:09
  • Try your fiddle with `max = 13` and see what happens. `undefined > 1` is `false`. – nnnnnn Sep 07 '12 at 04:10
  • Sorry, `13` was just the quickest way to turn `3` into a two-digit number. The output from your fiddle that I get in FF for the two-digit numbers is `Column010`, etc., i.e., it inserts the extra `0` every time because `i.length` is `undefined` and `undefined > 1` is `false`. – nnnnnn Sep 07 '12 at 04:14
  • Oh well, I messed up! hehe. I don't know why I even used `length` for that, maybe cuz I was thinking in strings because it gets turned into one with that `0`... – elclanrs Sep 07 '12 at 04:19
  • Thanks elclanrs for your answer. It is very good answer indeed. I've got my work fine now. – dnugroho Sep 07 '12 at 05:33
1

I suggest you change from a for..in loop to a standard for loop because iterating over an array with for..in is "dangerous" in that if you're using a library that adds properties/methods to the Array.prototype then the loop will iterate over those too.

Also, with a for..in the iterator i will be a string, creating "aTargets" : ["0"], and you want it to be a number to create "aTargets" : [0].

var aryColTableChecked = ["column00", "column01", "column02", "column03"];
var aryJSONColTable = [];

for (var i = 0; i <  aryColTableChecked.length; i++) {
    aryJSONColTable.push({
                      "sTitle": aryColTableChecked[i],
                      "aTargets": [i]
                    });
};

Seems to work fine: http://jsfiddle.net/nnnnnn/Ek8tr/

NOTE: What you're producing is not JSON, it is an array of objects. (JSON is a data-interchange format that is always a string. JSON looks like JS object literal and array literal syntax, but it's not the same thing.)

nnnnnn
  • 147,572
  • 30
  • 200
  • 241
  • You shouldn't use the for-in-enumeration yourself, then :-) But true, the string (a truthy value) could be the problem here. – Bergi Sep 07 '12 at 03:59
  • @Bergi - Oops - I thought I'd copied the standard `for` code from my fiddle, but I must've copied it from the question. Thanks. Fixed. I couldn't duplicate the problem the OP mentioned about have `"1"` in _every_ element though. – nnnnnn Sep 07 '12 at 04:04
  • Hi nnnnnn, thank you for your quick reply. I have tried what you have suggested above, and I still get value [1] for data "aTargets". This JSON format is specified at JQuery DataTables parameter aoColumnDefs, you may check this link http://datatables.net/usage/columns for more details. – dnugroho Sep 07 '12 at 04:11
  • I can't explain that result. You can see in my jsfiddle demo that `aryJSONColTable` ends up with the correct values in it. At what point are you checking the values and finding `[1]`? Before or after calling the `.dataTable()` method? – nnnnnn Sep 07 '12 at 04:25
  • Yes,nnnnnn, you're absolutely right! It works fine now! Previously I watched over the array value using Firebug-Watch panel, it always shows me value [1] for data "aTargets", but when you go deeper into its value, it really gets [0],[1], and so on. Thank you all for your great help. I also start learning how to use jsfiddle as you suggested ;-) – dnugroho Sep 07 '12 at 05:30