Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/414.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 选择2 ajax显示结果,但可以';t选择_Javascript_Jquery_Ajax_Json_Jquery Select2 - Fatal编程技术网

Javascript 选择2 ajax显示结果,但可以';t选择

Javascript 选择2 ajax显示结果,但可以';t选择,javascript,jquery,ajax,json,jquery-select2,Javascript,Jquery,Ajax,Json,Jquery Select2,我正在使用select2插件处理远程ajax数据。我可以在下拉列表中看到结果,但无法选择它们。我希望结果可以选择,并在选择后放入字段。我认为问题在于传递id,我不知道如何正确传递。。有什么想法吗 我的json for?tag_word=for…没有id results: [{text: "fort"}, {text: "food"}] 代码如下: <select class="js-data-example-ajax" style="width:100%"> &

我正在使用select2插件处理远程ajax数据。我可以在下拉列表中看到结果,但无法选择它们。我希望结果可以选择,并在选择后放入字段。我认为问题在于传递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>

因为你所有的id都是空的。换成数字。单击get selected按钮查看仅传递ID

var data = [{ id: 0, text: 'enhancement' }, { id: 1, text: 'bug' }, { id: 2, text: 'duplicate' }, { id: 3, text: 'invalid' }, { id: 4, text: 'wontfix' }];

$(document).ready(function(){

    $('.js-data-example-ajax').select2({
    minimumInputLength: 2,
    multiple:true,
    delay: 250,
    data: data


  });
});

$(".checkoutput").click(function(){
console.log($('.js-data-example-ajax').val());
})

以下是关于阿拉克山达尔答案的最后一个问题的进一步说明,请尝试添加如下代码:

$('.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 }; },
        success: function(results){
            for(var i = 0; i < results.length; i++){
                results[i] = {id:i,text:results[i].text}
            }
        }
    },
});
$('.js数据示例ajax')。选择2({
最小输入长度:2,
多重:对,
延误:250,
是的,
阿贾克斯:{
url:“/tags/search/autocomplete/”,
数据类型:“json”,
数据:函数(parms,page){return{tag_word:parms.term};},
成功:功能(结果){
对于(var i=0;i

我还没有测试过这些。因此,如果它有效,请接受Aleksandar的正确答案,而不是这一个。

这是一个快速破解。不确定如何处理select2文档。但是下面的代码在我的本地主机中工作

$(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   
            })

    });
}
$(文档).ready(函数(){
$.get(“json/select.json”,函数(数据){//在引号内指定json调用的url。
对于(变量i=0;i
要选择一个选项,每个结果都需要有一个唯一的id。因此,您可以使用以下代码(
processResults
)添加id


我的id为空,这就是问题所在。你是正确的。你能解释一下我如何只将id值传递给json吗?我尝试了你的建议,但没有成功//我如何只将id值传递给json//无法理解你的观点。你需要保留id和文本。你需要为每个id提供唯一的值。是的,我需要id和文本,但我已经得到了t文本..我错过了id,我不知道如何为每个id赋予唯一的值..我当前的结果:[{text:“fort”},{text:“food”}..没有id。如何将唯一id添加到我的结果中?[{id:0,text:“fort”},{id:1,text:“food”}]。我收到你的问题了吗?是的,这应该是最终结果,但我使用ajax加载json。我的问题是如何在使用远程数据加载时添加id唯一值,并且我没有值数组。谢谢你的建议,但我仍然无法选择项,控制台显示:结果:[{text:“fort”},{text:“food”}]…没有id值您的parms.term输出是什么您需要使用success:of$.ajaxIf我使用上述代码我得到错误:500(内部服务器错误)好的,我是在服务器端做的,因为我在客户端找不到解决方案。我只是为id添加了相同的属性“tag_word”,而不仅仅是文本。现在正在工作选择正确的答案,以便对其他在同一基础上搜索的人有所帮助。
$(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   
            })

    });
}
$('.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 }; },
        processResults: function (data) {
                    data.results.forEach(function (entry, index) {
                        entry.id = ''+index; // Better if you can assign a unique value for every entry, something like UUID
                    });

                    return data;
                },
                cache: true
    },
});