JQuery的自动完成 [英] JQuery Autocomplete

问题描述

我有一个问题，我的jQuery的自动完成字段。它的某种奇怪的。

这是我的自动完成场和脚本。从我的MVC功能的响应工作正常。 DropDownList的是可见的条目。但是，当我试图选择resultlist简单地消失的项目。没有人有一个想法？

 ＆LT; D​​IV CLASS =UI窗口小部件＆GT;
    ＆LT;输入ID =newPlayerName类型=文本名称=newPlayerName的onkeyup =checkRegistration（）/＆GT;
 ＆LT; / DIV＆GT;
 

code：

 ＆LT;脚本类型=文/ JavaScript的＆GT;
  $（函数（）{
      $（'＃newPlayerName'）。自动完成（{
          来源：函数（请求，响应）{
              $阿贾克斯（{
                  网址：'/教练/搜索'，
                  数据：{
                      SEARCHTERM：request.term
                  }，
                  数据类型：JSON，
                  输入：POST，
                  的minLength：1，                  成功：功能（数据）{
                      响应（数据）;
                  }
              }）;
          }，
          选择：函数（事件，UI）{
              checkRegistration（ui.item.value）;
          }，
          重点：函数（事件，UI）{
              。事件preventDefault（）;
              $（＃newPlayerName）VAL（ui.item.label）。
          }
      }）;
  }）;
＆LT; / SCRIPT＆GT;
 

啊......这是我使用jQuery脚本...

 ＆LT;脚本的src =/脚本/ jQuery的-1.9.0.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src =/脚本/ jQuery的-UI-1.10.0.custom.min.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src =/脚本/ jQuery的-UI-1.10.0.custom.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
 

解决方案

这似乎是错误的和你已经证明了code的一件事是你已经包含了的jQuery的UI <事实/ code>脚本两次（在缩小的和标准版本）。您应该只有一个：

 ＆LT;脚本的src =/脚本/ jQuery的-1.9.0.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本的src =/脚本/ jQuery的-UI-1.10.0.custom.min.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
 

I've got a problem with my jQuery autocomplete field. Its some kind of strange.

This is my autocomplete field and script. The response from my mvc function works fine. The Dropdownlist is visible entries. But when I'm trying to select an item the resultlist simply disappears. Does anyone have an idea?

 <div class="ui-widget">
    <input id="newPlayerName" type="text" name="newPlayerName" onkeyup="checkRegistration()" />
 </div>

code:

<script type="text/javascript">
  $(function () {
      $('#newPlayerName').autocomplete({
          source: function (request, response) {
              $.ajax({
                  url: '/Trainer/Search',
                  data: {
                      searchTerm: request.term
                  },
                  dataType: 'json',
                  type: 'POST',
                  minLength: 1,

                  success: function (data) {
                      response(data);
                  }
              });
          },
          select: function (event, ui) {
              checkRegistration(ui.item.value);
          },
          focus: function (event, ui) {
              event.preventDefault();
              $("#newPlayerName").val(ui.item.label);
          }
      });
  });
</script>

Ah ... this are the jquery scripts I'm using...

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

解决方案

One thing that seems wrong with the code you have shown is the fact that you have included the jquery-ui script twice (the minified and standard versions). You should have only one:

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

这篇关于JQuery的自动完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！