Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

selectize js use array as source

Hi I am getting back a JSON encoded array ("html") from my Ajax call that I would like to add in the selectize as both value and text (I am using a tag) . How can I do that ?

HTML

<input type="text" value="test" class="demo-default selectized" id="input-tags" tabindex="-1" style="display: block;">

JQUERY

try {
    data = $.parseJSON(html);
var obj = jQuery.parseJSON(html);

outcome = (obj.outcome);

$('#input-tags').selectize({
            delimiter: ',',
            persist: false,
            maxItems: 1,
            create: function (input) {
                return {
                    value: input,
                    text: input
                }
            }
        });

}

like image 275
Athanatos Avatar asked Oct 08 '13 00:10

Athanatos


2 Answers

You could map the array onto an array of objects, like this:

data = $.parseJSON(html);
var items = data.map(function(x) { return { item: x }; });

Then use "labelField" and "valueField" to specify the text/value:

$('#input-tags').selectize({
        delimiter: ',',
        persist: false,
        options: items,
        labelField: "item",
        valueField: "item"
    });

Fiddle Demo.

like image 195
McGarnagle Avatar answered Sep 20 '22 18:09

McGarnagle


With ES6 you can reduce your oneliner a bit

const items = data.map(item => ({item}));
like image 42
Grégory Copin Avatar answered Sep 17 '22 18:09

Grégory Copin