ASP .NET MVC 5 Showing search record in a table without any button click as soon as user start typing in search box

Question

My current Implementation:

public ActionResult Index(string Sorting_Order, string Search_Data)
{
   var modal = _repo.GetAllResturents();
   Search_Data = Search_Data.Trim();
   if (Search_Data != null)
      modal = from r in modal where r.Name.ToUpper().Contains(Search_Data.ToUpper()) select r;
      ViewBag.SortingName = String.IsNullOrEmpty(Sorting_Order) ? "Name_Description" : "";
      ViewBag.SortingCity = String.IsNullOrEmpty(Sorting_Order) ? "City_Description" : "";

      switch (Sorting_Order)
      {
         case "Name_Description":
            modal = modal.OrderByDescending(nam => nam.Name);
            break;
         case "City_Description":
            modal = modal.OrderByDescending(cit => cit.City);
            break;
         default:
            modal = modal.OrderBy(name => name.Name);
            break;
      }
      return View(modal);
 }

Index.cshtml:

<p>
    Search Name: <input type="search" id="search_id" />
    <input type="button"  value="Find" onclick="location.href='@Url.Action("index","Resturent")?search_data=' + $('#search_id').val()" />
</p>

I want some way so that I can show the records from a database as soon as the user starts typing in the search box. Is it possible using autocomplete or using Ajax ? and what is the best approach for this task.

Note: I am not looking for client-side search.

You'll definitely need Ajax calls for this. [This post](/q/10318575/3634538) should get you started. — Yom T., Jan 13 '19 at 08:51

score 1 · Accepted Answer · answered Jan 13 '19 at 12:33

1

For this you can use JQuery DataTable . Here is complete GitHub repository of using JQuery DataTable With ASP.NET MVC

This will give you lot more along with search record in a table without any button click as soon as user start typing in search box

answered Jan 13 '19 at 12:33

TanvirArjel

30,049
14
78
114

score 0 · Answer 2 · answered Jan 13 '19 at 16:19

0

The easiest way is to submit each type a button is pressed by Ajax. You can do this using jquery

$("#search_id").keyup(function () {
    //call ajax method
});

This will submit your data every time the user types a new key

answered Jan 13 '19 at 16:19

arod

124
4
13

ASP .NET MVC 5 Showing search record in a table without any button click as soon as user start typing in search box

2 Answers2