jquery 正在使用ACL向控制器发送请求

yshpjwxd  于 2024-01-07  发布在  jQuery
关注(0)|答案(3)|浏览(150)

我在ASP.NET Core MVC应用程序上工作,我有一个注册页面,如下所示,我想在模型状态为false时返回View错误:

  1. @model WebApplication2PROP.Entities.UserRegister
  2. @*
  3. For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
  4. *@
  5. @{
  6. }
  7. <section id="RegSection">
  8. <div class="container">
  9. <div class="row justify-content-center align-items-center">
  10. <div class="col-lg-6 col-md-6 col-sm-12 justify-content-center text-start ">
  11. <span asp-validation-for="FirstName" class="Validation"></span>
  12. <br />
  13. <label for="FirstName" class="form-label">First Name</label>
  14. <input type="text" id="FirstName" class="form-control" value="@Model.FirstName" name="FirstName" />
  15. <br />
  16. <span asp-validation-for="LastName" class="Validation"></span>
  17. <br />
  18. <label for="LastName" class="form-label">Last Name</label>
  19. <input type="text" id="LastName" class="form-control" value="@Model.LastName" name="LastName"/>
  20. <br />
  21. <span asp-validation-for="UserName" class="Validation"></span>
  22. <br />
  23. <label for="UserName" class="form-label">User name</label>
  24. <input type="text" id="UserName" class="form-control" value="@Model.UserName" name="UserName" />
  25. <br />
  26. <span asp-validation-for="Phonenumber" class="Validation"></span>
  27. <br />
  28. <label for="PhoneNumber" class="form-label">PhoneNumber</label>
  29. <input type="text" id="PhoneNumber" class="form-control" value="@Model.Phonenumber" name="Phonenumber"/>
  30. <br />
  31. <span asp-validation-for="Password" class="Validation"></span>
  32. <br />
  33. <label for="Password" class="form-label">Password</label>
  34. <input type="password" id="Password" class="form-control" value="@Model.Password" name="Password" />
  35. <br />
  36. <span asp-validation-for="ConfirmPassword" class="Validation"></span>
  37. <br />
  38. <label for="ConfirmPassword" class="form-label">Confirm Password</label>
  39. <input type="password" id="ConfirmPassword" class="form-control" value="@Model.ConfirmPassword" name="ConfirmPassword" />
  40. <div class="text-center"> <button class="btn text-center RegBut" id="RegBut">Register</button></div>
  41. <div class="text-center">
  42. Already have an account? @Html.ActionLink("Login","LoginPage","Home",null,new {@class ="btn RegBut"})
  43. </div>
  44. </div>
  45. </div>
  46. </div>
  47. </section>

字符串
控制器:

  1. [HttpPost]
  2. public async Task <IActionResult> SubmitLogin([FromBody]LogIn user)
  3. {
  4. try
  5. {
  6. if (!ModelState.IsValid)
  7. {
  8. return BadRequest(new { data = false });
  9. }
  10. else
  11. {
  12. return Ok(new { data = true });
  13. }
  14. await operations.Login(user);
  15. return RedirectToAction("MainPage","Home");
  16. }
  17. catch (Exception ex)
  18. {
  19. ModelState.AddModelError(nameof(user.UserName), ex.Message);
  20. return View("HomePage", user);
  21. }
  22. }


现在,我想使用apache发送数据:

  1. $("#RegBut").click(function () {
  2. // alert("clicked")
  3. var FirstName=$("#FirstName").val();
  4. var LastName = $("#LastName").val();
  5. var UserName = $("#UserName").val();
  6. var PhoneNumber = $("#PhoneNumber").val();
  7. var Password = $("#Password").val();
  8. var ConfirmPassword = $("#ConfirmPassword").val();
  9. var Data = { FirstName: FirstName, LastName: LastName, UserName: UserName, PhoneNumber: PhoneNumber, Password: Password, ConfirmPassword: ConfirmPassword }
  10. $.ajax({
  11. type: "POST",
  12. url: "/Home/SubmitRegister",
  13. contentType: "application/json",
  14. data: JSON.stringify(Data),
  15. success:function(data)
  16. {
  17. if (data.success)
  18. {
  19. // Registration was successful, redirect to MainPage
  20. window.location.href = '/Home/MainPage';
  21. }
  22. else
  23. {
  24. // Registration failed, update UI with validation errors
  25. alert("Data is not success");
  26. console.log(data)
  27. }
  28. },
  29. error: function (data)
  30. {
  31. console.log(data);
  32. }
  33. });
  34. });

问题是,当用户向控制器提交数据时,如果ModelState为false,如何重定向到上面的视图,并将每个验证错误都放在相关输入字段的上方?
我尝试返回如下视图:

  1. [HttpPost]
  2. public async Task <IActionResult> SubmitLogin([FromBody]LogIn user)
  3. {
  4. try
  5. {
  6. if (!ModelState.IsValid)
  7. {
  8. return View("Register",user);
  9. }
  10. else
  11. {
  12. return Ok(new { data = true });
  13. }
  14. await operations.Login(user);
  15. return RedirectToAction("MainPage","Home");
  16. }
  17. catch (Exception ex)
  18. {
  19. ModelState.AddModelError(nameof(user.UserName), ex.Message);
  20. return View("HomePage", user);
  21. }
  22. }


但是它不工作,它将HTML返回给apache。

dtcbnfnu

dtcbnfnu1#

这里的问题是,您正在使用jQuery Ajax来调用控制器方法。这里的问题是,每当发生任何验证错误时,您都在发送一个完整的视图,因此它会在响应中呈现整个HTML。请记住,您正在使用jQuery Ajax,因此您应该返回一个错误的请求,而不是返回视图,如下所示

  1. if (!ModelState.IsValid)
  2. {
  3. return BadRequest(ModelState);
  4. }

字符串
现在你将得到所有的验证消息,你可以用同样的方法来做这件事,但这里有一个例外。

  1. catch (Exception ex)
  2. {
  3. ModelState.AddModelError(nameof(user.UserName), ex.Message);
  4. return BadRequest(ModelState);
  5. }

展开查看全部
xxslljrj

xxslljrj2#

我在ASP.NET Core MVC应用程序上工作,我有一个注册页面,如下所示,我想在模型状态为false时返回View错误:
当前方法的问题是,直接返回视图作为对AJAX请求的响应是行不通的。AJAX需要JSON响应,而不是HTML。
以下是如何解决此问题的示例。
修改服务器响应:

  1. if (!ModelState.IsValid)
  2. {
  3. var errors = new List<object>();
  4. foreach (var key in ModelState.Keys)
  5. {
  6. foreach (var error in ModelState[key].Errors)
  7. {
  8. errors.Add(new { field = key, message = error.ErrorMessage });
  9. }
  10. }
  11. return Json(new { success = false, errors = errors });
  12. }

字符串

**注意:**需要注意的是,需要在客户端进行处理。不是直接从控制器返回视图,而是返回一个包含验证错误的JSON对象。我在这里具体做什么。

修改您的回复:

  1. if (!data.success) {
  2. for (var error of data.errors) {
  3. console.log(error.field + "-" + error.message);
  4. var inputElement = $("#" + error.field);
  5. console.log(inputElement);
  6. inputElement.addClass("is-invalid");
  7. inputElement.siblings(".Validation[name='" + error.field + "']").html(error.message);
  8. }
  9. }


修改您的验证范围名称属性:

  1. <span class="Validation" name="FirstName"></span>

输出量:


的数据

展开查看全部
46scxncf

46scxncf3#

你可以做的是通过aplogic获取重定向URL,然后使用JavaScript打开URL。当你的模型状态为false时,这将给你给予重定向的感觉。

相关问题