将属性添加到select2中的选定列表项

时间:2017-03-31 05:35:06

标签: jquery-select2-4

Here是一个有效的jsfiddle。我希望为创建的<li>元素添加属性(特别是id)。我的用例与小提琴略有不同,而不是使用数组,我从ajax获取数据。另外,如果数据库中没有相同的标签,我想让我的用户灵活地创建新标签。保存新创建的具有id的项目列表是一个比普通类更好的句柄。我可以修改创建的enter image description here <li>元素的属性吗?

我的实际代码是这样的:

$(".js-data-example-ajax").select2({
        ajax : {
            url : "/content/search_skills",
            dataType : 'json',
            delay : 250,
            data : function(params) {
                return {
                    q : params.term, // search term
                    page : params.page
                };
            },
            processResults : function(data, params) {
                params.page = params.page || 1;

                return {
                    results : data.items,
                    pagination : {
                        more : (params.page * 5) < data.total_count
                    }
                };
            },
            cache : true
        },
        escapeMarkup : function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength : 1,
        templateResult : formatRepo,
        templateSelection : formatRepoSelection,
        tags : true,
        createTag : function (params) {
            return {
                id: params.term,
                text: params.term,
                newOption: true
              }
            },
    });
    function formatRepo(repo) {
        if (repo.loading)
            return repo.text;

        var markup = '<ul class="list-group clear-list m-t">' + '<li class="list-group-item fist-item"><span class="pull-right">' + repo.id + '</span> <span class="label label-success">' + repo.count + '</span> ' + repo.text + '</li>';

        return markup;
    }

     function formatRepoSelection (repo) {
         var markup = repo.text;
         return markup;
          }

我的jsp(html)是:

<select class="js-data-example-ajax" style="width: 100%" multiple="multiple">
    //Iterating through database query result to pre-load option items
    <option value="<%=skill_objective.get("id")%>" selected="selected"><%=skill_objective.get("id")%> <%=skill_objective.get("name") %></option>
</select>

1 个答案:

答案 0 :(得分:0)

Here是一个有效的解决方案:

$(&#34; .js-data-example-ajax&#34;)。select2(&#39; data&#39;)会给我一个所选对象的哈希值。

相关问题