MVC 4:jQuery AutoComplete显示“undefined”列表

时间:2013-07-14 05:53:35

标签: asp.net-mvc-4 jquery-autocomplete

我是MVC新手,现在有问题。请给我解决方案。

我在MVC4中创建简单的AutoComplete文本框。 这是我的代码

在控制器中:

public ActionResult List(string term)
    {
        DebateEntities  _db = new DebateEntities ();
        var results = from u in _db.Users 
                      where u.username.ToLower().Contains(term.ToLower())
                      select new { u.username};

        return Json(results, JsonRequestBehavior.AllowGet);
    }    

在视图中

@model DebateApp.Models.MessageModels 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" >  
<head>  
    <title></title>  
    <link href="http://www.asp.net/ajaxLibrary/jQueryCodeSamplesMVC/Content/redmond/jquery-ui-1.8.2.custom.css" rel="stylesheet"  type="text/css" />  
</head>  
<body>  

    @using (Html.BeginForm())
    {
        <fieldset>  
        <legend>User Lookup</legend>  
            @Html.TextBox("name")
            @Html.TextBox("userID")
            <input type="submit" value="Find" />          
        </fieldset>  
    }

</body>  
    <script src="http://www.asp.net/ajaxLibrary/jQueryCodeSamplesMVC/Scripts/jQueryUI/jquery-1.4.2.min.js" type="text/javascript"></script>  
    <script src="http://www.asp.net/ajaxLibrary/jQueryCodeSamplesMVC/Scripts/jQueryUI/jquery-ui-1.8.2.custom.min.js"  type="text/javascript"></script>  
    <script type="text/javascript">
        $("#name").autocomplete({
            source: '@Url.Action("List")',
            select: function (event, ui) {
                $("#name").val(ui.item.username);
            }
        });  

</script>  
</html>      

当我在文本框中键入“d”时,会出现一个列表,但它们都是“未定义”。 当我选择“未定义”选项时,它会显示正确的用户名。

我如何解决“未定义”列表?

谢谢

1 个答案:

答案 0 :(得分:0)

是的,即使我早些时候遇到过这个问题。它的主要原因可能是你的jquery代码无法从源引用标记中提取内容。

我建议你使用以下

<script src="code.jquery.com/jquery-1.8.3.js"; type="text/javascript"></script> 
<script src="code.jquery.com/ui/1.9.2/jquery-ui.js"; type="text/javascript">

和jquery类似

<script type="text/javascript">
  $(function () {
      $('#name').autocomplete({
          source: '@Url.Action("List")',
          minLength: 1,
          select: function (evt, ui) {
            }
      });
  });
 </script>

您可以为控制器使用相同的代码。我发现没问题。很可能你不会再得到未定义的。