微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – select2 ajax显示结果但无法选择

我正在使用带有远程ajax数据的select2插件.我可以在下拉列表中看到结果,但无法选择它们.我希望结果可以选择并在选择后放入字段中.我认为问题在于传递id,我不知道如何正确传递它.任何想法?

我的json for?tag_word = for …没有id

results: [{text: "fort"}, {text: "food"}]

这里的代码

    <select class="js-data-example-ajax" style="width:100%">
      <option selected="selected">asdasd</option>
    </select>

    <link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
    <script type="text/javascript" src="{% static 'js/select2.js' %}"></script>
    <script >
    $(document).ready(function(){
    $('.js-data-example-ajax').select2({
    minimumInputLength: 2,
    multiple:true,
    delay: 250,
    cache: true,
    ajax: {
      url: '/tags/search/autocomplete/',
      dataType: 'json',
      data: function (parms, page) { return { tag_word: parms.term }; },
    },
  });
});  
    </script>

这是服务器代码

def autocomplete(request):
s = SearchQuerySet(using='autocomplete')
sqs = s.autocomplete(content_auto=request.GET.get('tag_word'))[:5]
suggestions = [  {'text':result.tag_word,
                    'id':result.tag_word,} for result in sqs]
the_data = json.dumps({
    'results': suggestions
})
return HttpResponse(the_data, content_type='application/json')

解决方法:

它是一个快速的黑客.不确定如何与select2 documentaion相处.但是下面的代码在我的localhost中与我一起工作.

$(document).ready(function(){
         $.get("json/select.json",function(data){ //specify your url for json call inside the quotes.
             for(var i = 0; i < data.length; i++){
                 data[i]={id:i,text:data[i].text}
             }
            $(".js-data-example-ajax").select2({
                    minimumInputLength: 2,
                    multiple:true,
                    delay: 250,
                    data: data   
            })

    });
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐