使用JQuery和数据库自动完成 - APS.NET MVC

我很抱歉这是一种重复，但是，即使在查看关于该主题的其他几个问题之后，我仍然无法获得我的工作。使用JQuery和数据库自动完成 - APS.NET MVC

我想在我的表单中使用JQuery自动完成小部件从数据库中的30K +记录中进行选择。我相信我的问题出现在.autocomplete函数的source左右。

HTML + JS

@using (Html.BeginForm()) 
{ 
    @Html.LabelFor(model => model.Name) 
    @Html.TextBoxFor(model =>model.Name, new { id="Search"}) 
} 
<script type="text/javascript"> 
    $('#Search').autocomplete({ 
     source: '@Url.Action("GetVendors", "TestAutoComplete")', 
     minLength: 3 
    }); 
</script>

控制器动作

[HttpGet] 
public JsonResult GetVendors(string Search) 
{ 
    return Json(DB.VendorLookUp(Search), JsonRequestBehavior.AllowGet); 
}

我知道我的DB.VendorLookUp方法的工作（我单独测试它），我有没有按该GetVendors方法中的断点不会受到打击。

在控制台中我得到这个错误：

GET http://localhost:50848/TestAutoComplete/GetVendors?term=mic 500 (Internal Server Error)

（其中 '麦克风' 是我试图搜索）。我假设问题的至少一部分是我的控制器方法是除了字符串“搜索”，当JS正在尝试获取“术语”。

在此先感谢您的帮助。

编辑：事情我已经尝试：

改变参数在我的控制器行动“搜索”到“术语”
由于没有在我的控制器行动
更新任何参数@ Url.Action（）沿值传递给：
- source: '@Url.Action("GetVendors", "TestAutoComplete", new {Search= $('#VendorSearch').val() })'
- ，但得到的错误
- Invalid anonymous type member declarator. Anonymous type members must be declared with a member assignment, simple name or member access.

UPDATE：错误消息

UPDATE：

多亏了评论意见，望着通过网络错误 - >检查响应了我一个有意义的错误。我试图赶上js调用，我可以有2个控制器动作 - 一个带有参数，另一个带无参数。这使代码混淆。我删除了没有参数的动作，现在控制器动作正常运行，DB.VendorLookUp返回Vendor_VM列表（控制器正确地转换为JSON对象）。

但是，结果没有正确返回 - 请参阅下面的图3。选项不在下拉列表中，并且不显示任何值。

如何更新cshtml/js以将名称传递给输入表单？
如何让这些值以适当的下拉方式显示？

来源

2017-02-27 swallis1

更改方法'公共JsonResult GetVendors（字符串项）' –

我已经试过了。仍然得到错误：'GET HTTP：//本地主机：50848/TestAutoComplete/GetVendors项=麦克风500（内部服务器错误）'当我控制器操作如下：？'[HTTPGET] 公共JsonResult GetVendors（字符串项） { 返回Json（DB.VendorLookUp（term），JsonRequestBehavior.AllowGet）; }' – swallis1

然后你的'VendorLookUp（）'方法抛出一个异常。使用您的浏览器工具（网络选项卡检查结果，其中将包括错误的详细信息） –

这工作：1）建立在你的控制器的操作，并设置RouteConfig开始这个动作

public class HomeController : Controller 
{ 
    public ActionResult Index20() 
    { 
     MyViewModel m = new MyViewModel(); 
     return View(m); 
    }

没有任何类型的母版页中创建一个视图

收藏此视图模型：

public class MyViewModel 
{ 
    public string SourceCaseNumber { get; set; } 
}

由蒂姆·威尔逊Typeahead.js为MVC 5种型号

更改为添加HtmlHelpers.cs的命名空间System.Web.Mvc.Html和重建 -

转到管理的NuGet包或PM控制台，并添加到MVC 5项目

加入这个类：

public class CasesNorm 
{ 
    public string SCN { get; set; } 
}

将这些方法添加到您的控制器：

private List<Autocomplete> _AutocompleteSourceCaseNumber(string query) 
    { 
     List<Autocomplete> sourceCaseNumbers = new List<Autocomplete>(); 
     try 
     { 
      //You will goto your Database for CasesNorm, but if will doit shorthand here 

      //var results = db.CasesNorms.Where(p => p.SourceCaseNumber.Contains(query)). 
      // GroupBy(item => new { SCN = item.SourceCaseNumber }). 
      // Select(group => new { SCN = group.Key.SCN }). 
      // OrderBy(item => item.SCN). 
      // Take(10).ToList(); //take 10 is important 

      CasesNorm c1 = new CasesNorm { SCN = "11111111"}; 
      CasesNorm c2 = new CasesNorm { SCN = "22222222"}; 
      IList<CasesNorm> aList = new List<CasesNorm>(); 
      aList.Add(c1); 
      aList.Add(c2); 
      var results = aList; 

      foreach (var r in results) 
      { 
       // create objects 
       Autocomplete sourceCaseNumber = new Autocomplete(); 

       sourceCaseNumber.Name = string.Format("{0}", r.SCN); 
       sourceCaseNumber.Id = Int32.Parse(r.SCN); 
       sourceCaseNumbers.Add(sourceCaseNumber); 
      } 
     } 
     catch (EntityCommandExecutionException eceex) 
     { 
      if (eceex.InnerException != null) 
      { 
       throw eceex.InnerException; 
      } 
      throw; 
     } 
     catch 
     { 
      throw; 
     } 
     return sourceCaseNumbers; 
    } 

    public ActionResult AutocompleteSourceCaseNumber(string query) 
    { 
     return Json(_AutocompleteSourceCaseNumber(query), JsonRequestBehavior.AllowGet); 
    } 

    throw; 
    } 
    catch 
    { 
     throw; 
    } 
    return sourceCaseNumbers; 
} 

public ActionResult AutocompleteSourceCaseNumber(string query) 
{ 
    return Json(_AutocompleteSourceCaseNumber(query), JsonRequestBehavior.AllowGet); 
}

归功于http://timdwilson.github.io/typeahead-mvc-model/

来源

2017-02-27 21:38:14 kblau

使用JQuery和数据库自动完成 - APS.NET MVC

回答

相关问题