Как добавить живой поиск в MVC с помощью AJAX и jquery.
Привет
Нужна помощь, чтобы разобраться в этом.
У меня есть таблица данных категории на странице MVC с полем поиска:
Это моя таблица с полем поиска:
<input type="text" id="search" placeholder="Search by category Name"/> <table id="catList" class="table table-bordered table-striped text-center" style="margin-top:20px;height:auto"> <thead class="text-uppercase" style="font-weight:bold; font-size:20px;"> <tr> <td>Category Name</td> <td>Category Image</td> @if(Session ["ad_id"] != null) { <td>Delete</td> } </tr> </thead> <tbody> @foreach(var item in Model) { <tr class="text-center" id="row_@item.cat_id"> <td style="padding-top:36px;font-size:20px;">@item.cat_name</td> <td><img src="@Url.Content(item.cat_image)" style=" height:100px;width:150px ;border-radius: 2px" /></td> @if(Session ["ad_id"] != null) { <td style="padding-top:36px"> <a href="javascript:void(0);" class="btn btn-danger" onclick="confirmDelete(@item.cat_id)"><span></span></a> </td> } </tr> } </tbody> </table>
Когда пользователь вводит любой ключ в поле поиска, я делаю ajax-вызов контроллеру.
Это код моего контроллера:
public ActionResult ViewCategory( string searchString ) { var categories = from m in dbnew.tbl_category select m; if(!String.IsNullOrEmpty(searchString)) { categories = categories.Where(s => s.cat_name.Contains(searchString)); } return View(categories); }
Что я уже пробовал:
Здесь Ajax-вызов выполнен успешно, но теперь я не знаю, как добавить данные результата на страницу просмотра после успеха Ajax-вызова.
я пытался сделать это, но не получил результата.
AJAX-код:
$(document).ready(function () { $("#search").keyup(function () { $("#catList").hide("fast"); var newStrSearch = $("#search").val(); //var newStrSearch = $("#search").val(); $.ajax({ type: "POST", url: "/Admin/ViewCategory", data: { searchString: newStrSearch }, success: function (categories) { //code to show result data in View page } }); }); });
Надеюсь на лучшее решение.
Заранее спасибо.