0

I have a bunch of comma-separated values stored as strings in a JSON file. My aim is to split these values to populate a select element which is based on Selectize.js. Code (excerpt) looks as follows:

var options = {};

var attr_split = data.attributes['Attribute1'].split(",");

var options_key;

for (var i = 0; i < attr_split.length; i++) { 
    options_key = attr_split[i]
    }

var options_values = {
    value: options_key,
    text: options_key,
    }

    if (options_key in options)
        options_values = options[options_key];
    options[options_key] = options_values;

$('#input').selectize({
    options: options,
});

Although this seems to work, the output in the select element only shows the last iterations done by the for loop. As per here and here, I've tried 

for (var i = 0; i < attr_split.length; i++) { 
    var options_key += attr_split[i]
    }

but this throws me undefined plus all concatenated strings without the separator as per the following example:

undefinedAttr1Attr2Attr3

When I simply test the loop using manual input of the array elements everything appears fine:

for (var i = 0; i < attr_split.length; i++) { 
    var options_key = attr_split[0] || attr_split[1] || attr_split[2]
    }

But this is not the way to go, since the number of elements differs per string.

Any idea on what I'm doing wrong here? I have the feeling it's something quite straightforward :)

Community
  • 1
  • 1
ACDSL
  • 87
  • 2
  • 7

2 Answers2

1

when you declare 'options_key' ,you are not initializing it.so its value is undefined .when you concatenate options_key += attr_split[i] .in first iteration options_key holds undefined.so only you are getting undefinedAttr1Attr2Attr3.

so declare and initialize options_key like.

var options_key="";

and in your loop

for (var i = 0; i < attr_split.length; i++) 
{ 
     options_key = attr_split[i]
}

Everytime you replace options_key with value of attr_split[i].so after the loop it will contain last element value.corrected code is

for (var i = 0; i < attr_split.length; i++) 
{ 
    options_key += attr_split[i]
}
balajisoundar
  • 581
  • 2
  • 11
  • Thanks. This indeed resolves the `undefined`, however leads to all split strings being concatenated again in the select input. Thus like this: `Attr1Attr2Attr3`. My goal is to have the results of the split strings show up as separate values, thus as Attr1, Attr2 and Attr3. This works when using `options_key = attr_split[i]`, but only shows the last iteration. Any idea on how to populate the select with the separated values, including all other iterations next to also the last one? – ACDSL Mar 11 '15 at 23:10
  • can you post the code that populates `select` element. – balajisoundar Mar 12 '15 at 05:34
  • Thanks for the fiddle! I think I get how it works in your example. My options are however populated in an `options` variable, which is then fed into an input element which is based on Selectize.js. I added the code which does this to the original post. Any idea on how to do it in this case? – ACDSL Mar 12 '15 at 23:14
  • sry, i am not familiar with selectize.js.Can you give an example structure of options variable. – balajisoundar Mar 13 '15 at 11:29
  • Sure, this is what it looks like (JSON): `{ "Attr1": { "value": "Attr1", "text": "Attr1" }, "Attr2": { "value": "Attr2", "text": "Attr2" } }` – ACDSL Mar 16 '15 at 06:33
  • here is your fiddle-https://jsfiddle.net/balajisoundar/g4Lcq1t7/. i moved `var options_values = { value: options_key, text: options_key, } if (options_key in options) options_values = options[options_key]; options[options_key] = options_values;` into your `for` loop – balajisoundar Mar 16 '15 at 07:49
0

Just change var options_key; to var options_key="";

The reason you are getting undefined is because you have not defined the variable properly.

Here is a working example

 var attr_split = "1,2,3,4".split(",");

var options_key="";

for (var i = 0; i < attr_split.length; i++) { 
    options_key += attr_split[i]
    }

    alert(options_key);
var options_values = {
    value: options_key,
    text: options_key
}
alert(options_values);
vidyasagar2012
  • 25
  • 6