Question

我正在使用这样的选择：

$('#category_field').selectize({           
       valueField: 'name',             
       searchField: 'name',
       delimiter: "/",           
       options: [],
       load: function(query,callback)
       {    
           if(!query.length) return callback();          
           $.ajax({
               url: '/categories/autocomplete',
               type: 'GET',
               dataType: 'jsonp',
               data: {                                    
               },
               error: function() {
                   callback();
               },
               success: function(res) {
                   callback(res.movies);
               } 
           });              
       }           
   }

）;

＆＃34;＃category_field＆＃34;只是文本类型的表单输入。

我验证了正在进行ajax请求，服务器的响应如下所示：

[
  {
    "_id": {
      "$oid": "568bee09421aa908fe000009"
    },
    "depth": 0,
    "name": "math",
    "parent_id": null,
    "parent_ids": [],
    "picture": {
      "url": "/uploads/category/picture/568bee09421aa908fe000009/Screenshot________________.png",
      "thumb": {
        "url": "/uploads/category/picture/568bee09421aa908fe000009/thumb_Screenshot________________.png"
      }
    }
  }
]

我的问题是自动完成下拉菜单甚至无法显示，该怎么办？

修改

我只是想提一下，我使用bootstrap 3，输入字段及其标签都包含在<div class=field>...</div>内，这个div包含在包含在面板内容器内的表单内。

这与问题有关吗？

Answer 1

此响应看起来不像是有效的JSON。检查控制台，或/并使用trycatch

try { $.ajax(...) } catch (err) { console.error(err); }

JSONP是crossDomain方法，也许你可以尝试删除它。

Answer 2

我注意到了什么

您没有向服务传递任何查询
您必须将preLoad设置为true才能加载选项，或者必须将preLoad设置为焦点以初始设置选项

或
您必须使用数组初始化选项

selectize.js无法使用远程网址

修改

2 个答案: