selectize.js - 使用数据数据选择选项列表人口

Question

我在表单中使用 selectize.js，并希望从 HTML 中填充选项列表。我对 0.12.0 版本的发行说明的理解是，使用“data-data”属性应该可以做到这一点，但我无法使其工作或在任何地方找到完整的工作示例。

我希望做这样的事情:

html:

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

与js:

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

编辑:我已经将 ' 替换为 "所以数据数据现在是:"[{"info":"aaa"},{"info":"bbb"}]"

跟进:现在选项列表已按预期填充，但它也覆盖了值标签，因此似乎不可能使用 n 个项目的选项列表呈现控件，但选择了 3 个(在我看来这似乎是失败的) dataAttr 的全部意义不是吗？？？？)。

我可以使用文档的 States 示例来完成这项工作 - 但这使用而不是 ，因此返回一个值数组而不是逗号分隔的列表。

那么......我如何实现多选，发布一个逗号分隔的列表，选项设置为 HTML 而不是 js。

Answer 1

终于得到了使用php数据的解决方案。

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

总之你可以这样写:

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

最后 :

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

注意:使用单引号