Question

Hi people I have the following JavaScript code in my Show All Games View:

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

and the following code to function my autocomplete in my ShowAllGames controller:

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);

    }

I don’t know why my autocomplete is not working as I type my information or words in in my database are not appearing. Also the search box that the script is refering to is the following:

@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>
}

I have a serach box and paging enabled all work well just want to know why my auto complete is not working

Thank you

If you require addtional information please ask me i wil provide thanks

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();
            }
        }
    }
}

My View:

@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

Besides the issue jrummell pointed out, your source argument doesn’t match the name of your action.

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

I suspect you are getting 404 errors as you type in the search box.

EDIT

Well it doesn’t make sense to me that you are not getting 404’s, but try this; remove the parameter string term from your action and use

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

within your function. If I remember correctly, the model binder will not set that parameter as expected.