如何ASP.NET Core Razor中处理Ajax请求
编程学习 2021-07-04 22:41www.dzhlxh.cn编程入门
本篇技术文章主要给大家讲述了如何ASP.NET Core Razor中处理Ajax请求这方面的知识点，有兴趣的朋友参考下。
在ASP.NET Core Razor(以下简称Razor)刚出来的时候,看了一下官方的文档,一直没怎么用过。
今天闲来无事,准备用Rozor做个项目熟练下,结果写第一个页面就卡住了。。折腾半天才搞好,狼蚁网站SEO优化给大家分享下解决方案。先来给大家简单介绍下Razor Razor Pages是ASP.NET Core的一项新功能，可以使编页面的编程方案更简单，更高效。Razor页面使用处理程序方法来处理传入的HTTP请求（GET / POST / PUT / Delete）。这些类似于ASP.NET MVC或WEB API的Action方法。Razor Pages遵循特定的命名约定，Handler方法也是如此。他们也遵循特定的命名约定，并与“On”前缀：和HTTP动词一样OnGet()，OnPost()等处理方法也有异步版本：OnGetAsync()，OnPostAsync()等。介绍完Razor,直接上图
功能很简单，就是个登录。用户点击"登录按钮"后利用Jquery获取文本框的值,异步提交到服务器。很简单的功能，相信大家都写过很多次了。啪啪啪几下代码就撸出来了。
##前台代码
<form method="post">
<div class="login-ic">
<i></i>
<input asp-for="Login.UserName" />
<div class="clear"> </div>
</div>
<div class="login-ic">
<i class="icon"></i>
<input asp-for="Login.PassWord" />
<div class="clear"> </div>
</div>
<div>
<ul>
<li>
<input type="checkbox" value="">
<label for="brand1">记得我</label>
</li>
</ul>
<a href="#" rel="external nofollow" >
忘记密码?
</a>
</div>
<div class="log-bwn">
<input type="button" value="登录">
</div>
<div class="log-bwn">
<input type="button" value="注册">
</div>
</form>
##Script代码
$("#btnLogin").click(function () {
$.post('/user/Login?hanler=LoginIn', { UserName:$("#UserName").val(), PassWord:$("#PassWord").val() }, function (data) {
console.log(data);
});
});
##后台代码
public class LoginModel : PageModel
{
private UserServiciCasee _userService;
public LoginModel(UserServiciCasee userService)
{
_userService = userService;
}
public void OnGet()
{
}
[BindProperty]
public UserLoginDto Login { get; set; }
public async Task<ActionResult> OnPostLoginInAsync()
{
//if (ModelState.IsValid)
//{
// var user = await _userService.LoginAsync(Login);
// if (user != null)
// {
// return new JsonResult(ApiResult.ToSucess("登录成功!"));
// }
// return new JsonResult(ApiResult.ToFail("帐号密码错误!"));
/