Select a population of a list of options with data data

Question

I am using selectize.js inside the form and would like to populate a list of options from HTML. My understanding of release notes for version 0.12.0 is that this should be possible using the data-data attribute, but I can't get it to work or find complete working examples anywhere.

I was hoping to do something like this:

HTML:

<label for="leagues">Leagues:</label>
<input type="text" id="leagues" name="leagues" class="form-control" value='aaa' data-data="[{'info': 'aaa'},{'info': 'bbb'}]">

with js:

$('#leagues').selectize({
});

EDIT: I have this working replacement "with" so the data data is now: "[{" info ":" aaa "}, {" info "" bbb "}}"

FOLLOW ON: now the options list is populated as expected, but it also overrides the value tag, so it is not possible to display a control with an optional list of n elements, but, say, with 3 selected (which seems to me to defeat the entire data point Attr, is not it??).

I can do this work using an example of states for documentation, but it uses, and not so, so it returns an array of values, not a comma-separated list.

So ... how to implement a multi-choice, POSTing comma-delimited list with options set with HTML not js.

Answer 1

Finally, we got a solution using php data.

<option value="my_id" title="{{$category_name}}" data-data='<?php echo str_replace("'", "\'", json_encode(array('my_desc'=> {{$category_desc}})))?>'>{{$category_name}} </option>

In short, you can write as follows:

$array_in_json = (json_encode($selected_array));
$array_ready_for_tag =str_replace("'", "\'", $array_in_json);

Finally:

<select data-data='<?php echo $array_ready_for_tag;?>' ... > ... </select>

Note: use a single quote