VSCode创建连接mysql的ASP.NET Core项目(续1:增加检索功能)

  前面两篇文章《VSCode创建连接mysql的ASP.NET Core项目》、《VSCode创建连接mysql的ASP.NET Core项目(续)》以微软的示例项目为基础,介绍了如何在VSCode中创建ASP.NET Core Web项目,并支持浏览、新建、编辑、删除等功能,本文在之前的项目基础上增加条件检索功能。
  微软的示例项目中介绍了支持下拉选择和输入字符串的检索项,本文介绍这两种方式的同时,再添加按时间检索的检索项。
  从微软的示例项目中可以看到,有两种方式可以传递过滤用的参数:
  第一种是通过URL方式传递,比如在浏览页面中点击“删除“链接,会将待删除的记录Id通过URL传递给删除页面,浏览页面中通过使用asp-route-id="@item.Id"来设置生成的链接中待参数item.Id,而删除页面通过指定@page "{id:int}"接收传过来的参数,并在OnGet和OnPost函数中使用,用于从数据库中检索要删除的记录。
  第二种是在示例项目的浏览页面中同时添加检索表单,将要检索的字段放在表单中,通过OnGet函数判断是否需要根据检索条件进行检索。
  本文中的检索功能是按照第二种方式增加的。
  有几个检索条件,就需要在页面对应的IndexModel中增加几个字段,如果需要下拉选择,还需要定义单独的属性用于保存下拉选择项。本项目中总共有三个检索项:名称、类型及最晚发布时间(可空),定义如下:

	[BindProperty(SupportsGet = true)]
     public string SearchString { get; set; }
     
     public SelectList Genres { get; set; }
     
     [BindProperty(SupportsGet = true)]
     public string MovieGenre { get; set; }
     
     [DataType(DataType.Date)]
     [BindProperty(SupportsGet = true)]
     public DateTime? ReleaseDate{get;set;}

  
在这里插入图片描述  根据微软的教程(参考文献1),属性增加BindProperty属性主要用于与检索表单中的字段对应,也就是在下列的表单中使用asp-for标记帮助程序设置的值与IndexModel中的属性值对应,在input中输入的值会赋予IndexModel中的同名的属性上。

<form>
    <p>
        类型<select asp-for="MovieGenre" asp-items="Model.Genres">
            <option value="">All</option>
        </select>
        名称: <input type="text" asp-for="SearchString" />
        发布时间晚于: <input  asp-for="ReleaseDate" />
        <input type="submit" value="检索" />
    </p>
</form>

  上述三个检索项中,SearchString的类型最简单,根据参考文献4中的对照表,String类型的属性对应的输入字段类型是text。而下拉选择使用的标签是select,同时使用asp-items指定下拉选择项数据源,该属性在IndexModel中的类型是SelectList,同时在OnGet事件中初始化该属性的值。
  而对时间属性而言,由于DateTime是结构性,为防止页面初始化时根据该值进行过滤,将该属性类型设置为可空类型,初始值为空。而在Index页面的表单中,根据参考文献4中给出的对应输入类型是datetime-local,设置为该类型后无法弹出日期选择框,如下图所示:

在这里插入图片描述  于是根据参考文献2-3,将时间字段的type属性删除,由程序自动判断时间字段的类型,此时即可弹出时间选择框(Ubuntu中截图截不到弹出的时间选取框),也可以清除时间字段的内容。
在这里插入图片描述在这里插入图片描述  至此,搜索功能增加完毕,有兴趣的朋友还可以根据参考文献4继续增加其它类型的条件检索字段。由于初学ASP.NET Core,很多理解可能有误或者不深,欢迎相互交流。
  后续还会根据微软的教程及示例项目,继续增加本项目中的功能。

参考文献:
[1]https://docs.microsoft.com/zh-cn/aspnet/core/tutorials/razor-pages/search?view=aspnetcore-5.0
[2]https://www.it1352.com/1945400.html
[3]https://www.it1352.com/1945390.html
[4]https://docs.microsoft.com/zh-cn/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-5.0#the-input-tag-helper

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值