我一直在努力获得一个简单的示例,即jQuery-ui自动完成工作。我有一个控制器设置来处理查询,它返回看起来井井有条的JSON,但我没有得到任何建议。

这是我包括的JS库:

<script type="text/javascript" language="javascript" src="/Scripts/jquery-1.4.1.js"></script>

<script type="text/javascript" language="javascript" src="/Scripts/jquery-ui-1.8.1.custom.min.js"></script>

 <link href="/Content/jquery-ui-1.8.1.custom.css" rel="stylesheet" type="text/css" />

这是JavaScript和表单标签:

<script type="text/javascript">
    $(function () {

        $("#organization").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '/Organization/OrganizationLookup',
                    dataType: "json",
                    data: {
                        limit: 12,
                        q: request.term
                    }
                })
            },
            minLength: 2
        });
    });
</script> 

<div class="ui-widget"> 
    <label for="organization">Organization: </label> 
    <input id="organization" /> 
</div> 

我得到了一个JSON响应,从我的控制器那里看起来很合理:

[
  {
    "id":"Sector A",
    "value":"Sector A"
  },
  {
    "id":"Sector B",
    "value":"Sector B"
  },
  {
    "id":"Sector C",
    "value":"Sector C"
  }
]

ID和值似乎是AutoComplete正在寻找的默认命名。

但是我一点也没有快乐。有什么想法吗?

有帮助吗?

解决方案

不是这里的问题 - 您应该将CSS放在JavaScript之前。总是。

您没有用回报值做任何事情。您需要使用回调函数来获取该数据并使用它。 (我相信“成功:”参数)。

其他提示

多亏了Hogan的建议,我在成功参数中添加了以下回调函数,我很高兴去:

 success: function (data) {
                          response($.map(data, function (item) {
                              return {
                                  label: item.label,
                                  value: item.value
                              }
                          }))
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top