javascript - Jquery select2 json 数据与 optgroup 和图像

Question

我正在使用 select2 和 spring mvc。我从 Controller 获取了需要在此处以选项形式显示的数据。但我希望将它们分组为 optgroup，并且我希望将图像附加到其中，可以手动插入，如下所示:-

 <optgroup label="group">
    <option value="imageName">value 1</option>
    <option value="imageName">value 1</option>
    </optgroup>

其中 imageName 是图像的名称。我想要 :1) json 中的组选项。2)在json中提供此图像属性，以便select2可以形成数据。

这是代码:

$("#my-select").select2({
        data : [ {
            id : 0,
            text : 'enhancement'
        }, {
            id : 1,
            text : 'bug'
        }, {
            id : 2,
            text : 'duplicate'
        }, {
            id : 3,
            text : 'invalid'
        }, {
            id : 4,
            text : 'wontfix'
        } ]
    });

我正在从我的对象手动创建我的 json。所以我可以在这里提供任何数据。有什么建议吗？

Answer 1

Select2 将数据对象映射到 <option>和<optgroup>使用以下逻辑的标签

<小时/>

一个数据对象(列表中返回的内容)看起来像

{
  'id': 'value-here',
  'text': 'text-here'
}

将映射到<option>看起来像

<option value="value-here">text-here</option>

<小时/>

看起来像的数据对象

{
  'text': 'label-here',
  'children': [data_object, data_object]
}

将被映射到 <optgroup>看起来像

<optgroup label="label-here">
  <!-- HTML for the `children` -->
</optgroup>

<小时/>

因此您要返回的数据对象是

{
  'text': 'group',
  'children': [
    {
      'id': 'imageName',
      'text': 'value 1'
    },
    {
      'id': 'imageName',
      'text': 'value 1'
    }
  ]
}