Autocomplete base de données

Question

Salut les gens je le code JavaScript suivant dans mon Tous les jeux Vue:

<script> 
    $('#SearchBox').autocomplete({ source: '/Controller/ShowAllGames' }); 
</script> 

et le code suivant pour fonctionner mon autocomplete dans mon contrôleur ShowAllGames:

public ActionResult AutoCompleteGames(string term) 
    { 
     var db = new gamezoneDBEntities(); 
     return Json(db.tblGames.Where(games => games.GameName.StartsWith(term)).Select(games => games.GameName), JsonRequestBehavior.AllowGet); 

    } 

Je don Je ne sais pas pourquoi ma saisie semi-automatique ne fonctionne pas car je tape mes informations ou des mots dans ma base de données n'apparaissent pas. Aussi la boîte de recherche que le script est référait à est la suivante:

@using (Html.BeginForm()) 
{ 
    <div id="SearchBorder"> 
    <div id="TopSearch"> 

     @Html.TextBox("DisplaySearchResults", "", new { style = "width:420px;" }) 
     <input id="SearchBox" type="submit" value="Search news archives"/> 
     </div> 
     </div> 
} 

J'ai une boîte serach et la pagination ENABLED tous fonctionnent bien veux juste savoir pourquoi mon complet automatique ne fonctionne pas

Merci

Si vous désirez des informations complémentaires s'il vous plaît me demander je wil fournir grâce

EDIT:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using PagedList; 
using GamesTest.Models; 


namespace GamesTest.Controllers 
{ 
    public class ShowAllGamesController : Controller 
    { 
     // 
     // GET: /ShowAllGames/ 

     public ActionResult Index(string Ordering, string WordFilter, string DisplaySearchResults, int? CounterForPage) 
     { 
      using (var db = new gamezoneDBEntities()) 
      { 

       ViewBag.Message = TempData["message"]; 
       ViewBag.CurrentSort = Ordering; 
       ViewBag.NameSortParm = String.IsNullOrEmpty(Ordering) ? "GameName" : ""; 
       ViewBag.DateSortParm = Ordering == "ReleaseYearOfGame" ? "DiscriptionOfGame" : "Date"; 


       { 
        TempData["DisplaySearchResult"] = DisplaySearchResults; 

        { 
         ViewBag.search = DisplaySearchResults; 
        } 
        if (Request.HttpMethod == "GET") 
        { 
         DisplaySearchResults = WordFilter; 
        } 
        else if (DisplaySearchResults == "") 
        { 
         ViewData["MyMessage"] = "Nothing Has Been Entered."; 

        } 

        else 
        { 
         CounterForPage = 1; 
        } 

        ViewBag.CurrentFilter = DisplaySearchResults; 

        var FullDatabaseItem = from b in db.tblGames 
              select b; 
        if (!String.IsNullOrEmpty(DisplaySearchResults)) 
        { 
         FullDatabaseItem = FullDatabaseItem.Where(b => b.GameName.ToUpper().Contains(DisplaySearchResults.ToUpper())); 

        } 
        switch (Ordering) 
        { 
         case "HeadlineName": 
          FullDatabaseItem = FullDatabaseItem.OrderBy(b => b.GameName); 
          break; 
         case "DatePosted": 
          FullDatabaseItem = FullDatabaseItem.OrderBy(b => b.ReleaseYear); 
          break; 
         case "DiscriptionDate": 
          FullDatabaseItem = FullDatabaseItem.OrderBy(b => b.ReleaseYear); 
          break; 
         default: 
          FullDatabaseItem = FullDatabaseItem.OrderByDescending(b => b.ReleaseYear); 
          break; 
        } 

        int pageSize = 3; 
        int pageNumber = (CounterForPage ?? 1); 
        var PageNumberResults = FullDatabaseItem.ToPagedList(pageNumber, pageSize); 
        ViewBag.PageNumberResults = FullDatabaseItem.Count(); 
        if (PageNumberResults.Any()) 
        { 

         return View(PageNumberResults); 
        } 

        return View("ErrorView"); 
       } 
      } 
     } 


     public ActionResult AutoCompleteGames() 
     { 
      var db = new gamezoneDBEntities(); 
      string term = this.Request.Params["term"].ToString(); 
      return Json(db.tblGames.Where(games => games.GameName.StartsWith(term)).Select(games => games.GameName), JsonRequestBehavior.AllowGet); 

     } 

     // 
     // GET: /ShowAllGames/Details/5 


     public ViewResult Details(int id) 
     { 
      using (var db = new gamezoneDBEntities()) 
      { 
       tblGame tblgame = db.tblGames.Find(id); 
       return View(tblgame); 
      } 
     } 

     // 
     // GET: /ShowAllGames/Create 

     public ActionResult Create() 
     { 
      return View(); 
     } 

     // 
     // POST: /ShowAllGames/Create 

     [HttpPost] 
     public ActionResult Create(FormCollection collection) 
     { 
      try 
      { 
       // TODO: Add insert logic here 

       return RedirectToAction("Index"); 
      } 
      catch 
      { 
       return View(); 
      } 
     } 

     // 
     // GET: /ShowAllGames/Edit/5 

     public ActionResult Edit(int id) 
     { 
      return View(); 
     } 

     // 
     // POST: /ShowAllGames/Edit/5 

     [HttpPost] 
     public ActionResult Edit(int id, FormCollection collection) 
     { 
      try 
      { 
       // TODO: Add update logic here 

       return RedirectToAction("Index"); 
      } 
      catch 
      { 
       return View(); 
      } 
     } 

     // 
     // GET: /ShowAllGames/Delete/5 

     public ActionResult Delete(int id) 
     { 
      return View(); 
     } 

     // 
     // POST: /ShowAllGames/Delete/5 

     [HttpPost] 
     public ActionResult Delete(int id, FormCollection collection) 
     { 
      try 
      { 
       // TODO: Add delete logic here 

       return RedirectToAction("Index"); 
      } 
      catch 
      { 
       return View(); 
      } 
     } 
    } 
} 

Mon Vue:

@model PagedList.IPagedList<GamesTest.tblGame> 

@{ 
    ViewBag.Title = "Index"; 
} 

@*<h2>Index</h2>*@ 

@using (Html.BeginForm()) 
{ 
    <div id="SearchBorder"> 
    <div id="TopSearch"> 

     @Html.TextBox("DisplaySearchResults", "", new { style = "width:420px;" }) 
     <input id="SearchBox" type="submit" value="Search news archives"/> 
     </div> 
     </div> 
} 


<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script> 
<script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.autocomplete.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.position.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.core.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.ui.widget.js" type="text/javascript"></script> 

<p> 
@* @Html.ActionLink("Create New", "Create")*@ 
</p> 
<table id = "OverAll"> 
@* <tr> 
     <th> 
      GameID 
     </th> 
     <th> 
      GameName 
     </th> 
     <th> 
      ReleaseYear 
     </th> 
     <th> 
      Cost 
     </th> 
     <th> 
      Description 
     </th> 
     <th> 
      Downloads 
     </th> 
     <th> 
      Image 
     </th> 
     <th> 
      Console 
     </th> 
     <th> 
      UserName 
     </th> 
     <th></th> 
    </tr>*@ 

@foreach (var item in Model) { 
    <tr> 
    @* <td> 
      @Html.HiddenFor(modelItem => item.GameID) 
     </td>*@ 

     <td id = "TableLayout1"> 
      <img width="100" height="100"alt="ImageFromDatabase" src='@item.Image' /> 
     </td> 
     <td id = "TableLayout2"> 
      @*@Html.DisplayFor(modelItem => item.GameName)*@ 
      @Html.ActionLink(item.GameName, "Details", new { id = item.GameID }) 
     </td> 

     <td id = "TableLayout3"> 
      @Html.DisplayFor(modelItem => item.ReleaseYear) 
     </td> 
     <td id = "TableLayout4"> 
      @Html.Raw(item.Description.Substring(0, item.Description.IndexOf(".") + 1)) 
      @* @Html.DisplayFor(modelItem => item.Description)*@ 
     </td> 
     <td id = "TableLayout5"> 
      @Html.DisplayFor(modelItem => item.Cost) 
     </td> 

     <td id = "TableLayout6"> 
      @Html.DisplayFor(modelItem => item.Downloads) @*want this as a link so I can then click on it and show the game downloads*@ 

     </td> 

     <td id = "TableLayout7"> 
      @Html.DisplayFor(modelItem => item.ConsoleNameIDFK) 
     </td> 
     @*<td> 
      @Html.HiddenFor(modelItem => item.UserName) 
     </td>*@ 
    @* <td> 
      @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) | 
      @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) | 
      @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ }) 
     </td>*@ 
    </tr> 
} 

</table> 
@*Below is coding for the page count and the number of results found with the serach result displayed*@ 

<div class="PageCounter"> 
    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) 
    of @Model.PageCount 
    &nbsp; 
    @if (Model.HasPreviousPage) 
    { 

     @Html.ActionLink("<<", "Index", new { CounterForPage = 1, Ordering = ViewBag.CurrentSort, WordFilter = ViewBag.WordFilter }) 
     @Html.Raw("&nbsp;"); 
     @Html.ActionLink("< Previous Page", "Index", new { CounterForPage = Model.PageNumber - 1, Ordering = ViewBag.CurrentSort, WordFilter = ViewBag.WordFilter }) 
    } 
    else 
    { 
     @:<< 
     @Html.Raw("&nbsp;"); 
     @:< Prev 
    } 
    &nbsp; 
    @if (Model.HasNextPage) 
    { 
     @Html.ActionLink("Next Page >", "Index", new { CounterForPage = Model.PageNumber + 1, Ordering = ViewBag.CurrentSort, WordFilter = ViewBag.CurrentFilter }) 
     @Html.Raw("&nbsp;"); 
     @Html.ActionLink(">>", "Index", new { CounterForPage = Model.PageCount, Ordering = ViewBag.CurrentSort, WordFilter = ViewBag.CurrentFilter }) 
    } 
    else 
    { 
     @:Next> 
     @Html.Raw("&nbsp;") 
     @:>> 
    } 

    @String.Format("Total of {0} results", ViewBag.PageNumberResults) 
    (For @ViewBag.Search) 


@* @if(ViewBag.Message != null) 
{ 
    <p>@ViewBag.Message</p> 
} 
*@ 


</div> 


<script type="text/javascript"> 
    var uvOptions = {}; 
    (function() { 
     var uv = document.createElement('script'); uv.type = 'text/javascript'; uv.async = true; 
     uv.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'widget.uservoice.com/ZRhsC1RL1m4gK5megTxxlw.js'; 
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(uv, s); 
    })(); 
</script> 


<script type="text/javascript"> 
    $('#DisplaySearchResults').autocomplete({ source: '/Controller/ShowAllGames' }); 
</script> 

Answer 1

Outre la question jrummell a souligné, votre argument source ne correspond pas au nom de votre action. Je suspecte que vous obtenez des erreurs 404 que vous tapez dans la boîte de recherche.

EDIT

Eh bien, il ne me fait pas de sens que vous ne recevez pas de 404 de, mais essayez ceci; supprimez le paramètre string term de votre action et utiliser

string term = this.Request.Params["term"].ToString(); 

au sein de votre fonction. Si je me souviens bien, le classeur modèle ne définira pas ce paramètre comme prévu.

Answer 2

Un problème est que vous faites votre bouton autocomplete au lieu de votre zone de texte. Changer l'initialisation de votre saisie semi-automatique à ce qui suit:

$('#DisplaySearchResults').autocomplete({ source: '/Controller/ShowAllGames' });