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

@model WebApplication2PROP.Entities.UserRegister
@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
}
<section id="RegSection">
    <div class="container">
        <div class="row justify-content-center align-items-center">
            <div class="col-lg-6 col-md-6 col-sm-12 justify-content-center text-start ">

                    <span asp-validation-for="FirstName" class="Validation"></span>
                    <br />
                    <label for="FirstName" class="form-label">First Name</label>
                    <input type="text" id="FirstName" class="form-control" value="@Model.FirstName" name="FirstName" />
                    <br />

                    <span asp-validation-for="LastName" class="Validation"></span>
                    <br />
                    <label for="LastName" class="form-label">Last Name</label>
                    <input type="text" id="LastName" class="form-control" value="@Model.LastName" name="LastName"/>

                    <br />

                    <span asp-validation-for="UserName" class="Validation"></span>
                    <br />
                    <label for="UserName" class="form-label">User name</label>
                    <input type="text" id="UserName" class="form-control" value="@Model.UserName" name="UserName" />

                    <br />
                    <span asp-validation-for="Phonenumber" class="Validation"></span>
                    <br />
                    <label for="PhoneNumber" class="form-label">PhoneNumber</label>
                    <input type="text" id="PhoneNumber" class="form-control" value="@Model.Phonenumber" name="Phonenumber"/>

                    <br />
                    <span asp-validation-for="Password" class="Validation"></span>
                    <br />
                    <label for="Password" class="form-label">Password</label>
                    <input type="password" id="Password" class="form-control" value="@Model.Password" name="Password" />

                    <br />
                    <span asp-validation-for="ConfirmPassword" class="Validation"></span>
                     <br />
                    <label for="ConfirmPassword" class="form-label">Confirm Password</label>
                    <input type="password" id="ConfirmPassword" class="form-control" value="@Model.ConfirmPassword" name="ConfirmPassword" />

                    <div class="text-center"> <button class="btn text-center RegBut" id="RegBut">Register</button></div>
                    <div class="text-center">
                        Already have an account? @Html.ActionLink("Login","LoginPage","Home",null,new {@class ="btn RegBut"})
                    </div>

                
                 
            </div>
            
        </div>
    </div>
</section>

字符串
控制器：

[HttpPost]
        public async Task <IActionResult>  SubmitLogin([FromBody]LogIn user)
        {
            try
            {
                if (!ModelState.IsValid)
                {
                    return BadRequest(new { data = false });
                }
                else
                {
                    return Ok(new { data = true });
                }
                await operations.Login(user);
                return RedirectToAction("MainPage","Home");
            }
            catch (Exception ex) 
            {
                ModelState.AddModelError(nameof(user.UserName), ex.Message);
                return View("HomePage", user);
            }
        }

型
现在，我想使用apache发送数据：

$("#RegBut").click(function () {
         //   alert("clicked")
            var FirstName=$("#FirstName").val();
            var LastName = $("#LastName").val();
            var UserName = $("#UserName").val();
            var PhoneNumber = $("#PhoneNumber").val();
            var Password = $("#Password").val();
            var ConfirmPassword = $("#ConfirmPassword").val();
            var Data = { FirstName: FirstName, LastName: LastName, UserName: UserName, PhoneNumber: PhoneNumber, Password: Password, ConfirmPassword: ConfirmPassword }
            $.ajax({
                type: "POST",
                url: "/Home/SubmitRegister",
                contentType: "application/json",
                data: JSON.stringify(Data),
                success:function(data)
                {
                    if (data.success)
                    {
                     // Registration was successful, redirect to MainPage
                      window.location.href = '/Home/MainPage';
                     }
                 else 
                 {
                     // Registration failed, update UI with validation errors
                     alert("Data is not success");
                     console.log(data)
                  }
                 },
                error: function (data) 
                {
                    console.log(data);
                }

            });
        });

型

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

[HttpPost]
        public async Task <IActionResult> SubmitLogin([FromBody]LogIn user)
        {
            try
            {
                if (!ModelState.IsValid)
                {
                    return View("Register",user);
                }
                else
                {
                    return Ok(new { data = true });
                }
                await operations.Login(user);
                return RedirectToAction("MainPage","Home");
            }
            catch (Exception ex) 
            {
                ModelState.AddModelError(nameof(user.UserName), ex.Message);
                return View("HomePage", user);
            }
        }

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

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

if (!ModelState.IsValid)
{
    var errors = new List<object>();
    foreach (var key in ModelState.Keys)
    {
        foreach (var error in ModelState[key].Errors)
        {
            errors.Add(new { field = key, message = error.ErrorMessage });
        }
    }
    return Json(new { success = false, errors = errors });
}

字符串

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

修改您的回复：

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

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

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

型

输出量：

的数据

3条答案

按热度按时间

dtcbnfnu1#

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

if (!ModelState.IsValid)
{
   return BadRequest(ModelState);
}

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

catch (Exception ex) 
        {
            ModelState.AddModelError(nameof(user.UserName), ex.Message);
            return BadRequest(ModelState);
        }

赞(0）回复(0）举报 6个月前

xxslljrj2#