您当前的位置: 首页 >  寒冰屋 搜索

在Web应用程序中执行常见搜索场景的服务器端方法

寒冰屋 发布时间:2021-10-28 22:53:15 ,浏览量:3

目录

介绍

例子

添加搜索模型

修改Home控制器

修改Home视图

介绍

应用程序中需要的一个常见场景是针对某个搜索值搜索数据模型。由于http协议的性质(无状态):

  1. 搜索结果的提交将再次呈现页面。
  2. 输入的搜索表达式将丢失。

这个问题的一个常见解决方案是使用jquery创建一个异步http请求来重绘将保存搜索结果的部分。

例子

1. 在Visual Studio 2019中创建一个新的ASP.NET MVC Core应用程序,如下所示:

2.在models文件夹下添加一个名为ShopInfoModel的模型,在model中放置如下代码

 public class ShopInfoModel
{

    public int ID { get; set; }


    public string Name { get; set; }


    public string Address { get; set; }


    public int Pincode { get; set; }

}

3.在控制器文件夹中用下面的代码替换Home控制器的代码

 public class HomeController : Controller
    {
        public HomeController()
        {
           
        }

        public IActionResult IndexDisplaySearchWithAjaxRequest()
        {
            return View();
        }
        public IActionResult Index()
        {
            return View(new ShopInfoSearchModel { shops = new List() });
        }

        [HttpGet]
        public IActionResult Search(string name)
        {
            /*For simplicity this is a dummy list for test*/
            List shops = new List
            {
               new ShopInfoModel{Name="Model1",Pincode=1},
               new ShopInfoModel{Name="Model2",Pincode=2},
            };

             shops = shops.Where(w => w.Name.Contains(name)).ToList();

            return Json(shops);
        }

    [HttpPost]
        public IActionResult Search(ShopInfoSearchModel searchModel)
        {
            /*For simplicity this is a dummy list for test*/
            List shops = new List
            {
               new ShopInfoModel{Name="Model1",Pincode=1},
               new ShopInfoModel{Name="Model2",Pincode=2},
            }; 
            
            searchModel.shops = shops.Where(w => w.Name.Contains(searchModel.SearchText)).ToList();

            return View("Index", searchModel);
        }
    }

...

4. 在views\home文件夹下添加一个名为IndexDisplaySearchWithAjaxRequest的视图。在视图中放置如下代码如下

@{

    ViewData["Title"] = "Home Page";
}

    
Search
@section Scripts { $(document).ready(function () { $("#btnsearch").click(function() { $.ajax({ url: '@Url.Action("Search", "Home")', data: { "name": $("#txtsearch").val()}, success: function (data) { var table = $(""); for (var i = 0; i < data.length; i++) { var row = $(''); //--->foreach column we will add a concat operation w.Name.Contains(searchModel.SearchText)).ToList(); return View("Index", searchModel); } } ...

修改Home视图

将home/index.cshtm中的代码替换为以下内容

@{
   
    ViewData["Title"] = "Home Page";
}

@using (Html.BeginForm("Search", "Home", FormMethod.Post))
{
    
' + data[i].name + '' + data[i].address + '' + data[i].pincode + '
@foreach (var item in Model.shops) { }
@Html.TextBoxFor(f => f.SearchText) Search
@Html.DisplayFor(modelItem => item.ID) @Html.DisplayFor(modelItem => item.Name) @Html.DisplayFor(modelItem => item.Address) @Html.DisplayFor(modelItem => item.Pincode)
} ...

运行应用程序时,将通过单击搜索按钮执行对模型的搜索,并将给出与ajax请求方法相同的结果

https://www.codeproject.com/Tips/5303793/Server-Side-Approach-for-Executing-Common-Search-S

 

关注
打赏
查看更多评论