表单模型在POST之前未通过验证 [英] Form model not validating before POST

问题描述

我正在尝试在Web应用程序中创建注册页面.但是，我的表单上的验证无效.例如，我的密码最小长度为4位租船人，但是如果输入空白密码，它仍会发出POST请求.我如何告诉表格该模型无效，他们应该更改密码，电子邮件等?

I'm trying to make a registration page in my web application. However, the validation on my form is not working. For example I have my password minimum length be 4 charterers but if I enter a blank password it still makes the POST request. How do I tell the form that the model is not valid and that they should change their password,email, etc?

AccountController.cs

[HttpPost]
public ActionResult Register(RegisterModel model){
    if (ModelState.IsValid){
        // Insert into database
    }
    // There was an error
    return View(model);
}

RegisterModel.cs

RegisterModel.cs

public class RegisterModel
{

    [Required]
    [Display(Name = "UserName")]
    public string UserName { get; set; }

    [Required]
    [EmailAddress]
    [Display(Name = "Email")]
    public string Email { get; set; }

    [Required]
    [StringLength(100, ErrorMessage = "The {0} must be at least {2} and at max {1} characters long.", MinimumLength = 4)]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }

    [DataType(DataType.Password)]
    [Display(Name = "Confirm password")]
    [Compare("Password", ErrorMessage = "The password and confirmation password do not match.")]
    public string ConfirmPassword { get; set; }
}

Register.cshtml

Register.cshtml

@model RegisterModel
    <form asp-controller="Account" asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="form-horizontal">
        <h4>Create a new account.</h4>
        <hr />
        <div asp-validation-summary="All" class="text-danger"></div>
        <div class="form-group">
            <label asp-for="UserName" class="col-md-2 control-label"></label>
            <div class="col-md-10">
                <input asp-for="UserName" class="form-control" />
                <span asp-validation-for="UserName" class="text-danger"></span>
            </div>
        </div>
        <div class="form-group">
            <label asp-for="Email" class="col-md-2 control-label"></label>
            <div class="col-md-10">
                <input asp-for="Email" class="form-control" />
                <span asp-validation-for="Email" class="text-danger"></span>
            </div>
        </div>
        <div class="form-group">
            <label asp-for="Password" class="col-md-2 control-label"></label>
            <div class="col-md-10">
                <input asp-for="Password" class="form-control" />
                <span asp-validation-for="Password" class="text-danger"></span>
            </div>
        </div>
        <div class="form-group">
            <label asp-for="ConfirmPassword" class="col-md-2 control-label"></label>
            <div class="col-md-10">
                <input asp-for="ConfirmPassword" class="form-control" />
                <span asp-validation-for="ConfirmPassword" class="text-danger"></span>
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <button type="submit" class="btn btn-default">Register</button>
            </div>
        </div>
    </form>

灵魂 由于Register页面位于Home控制器下，而Register逻辑位于Account控制器中，因此我必须定义视图以加载Register.cshtml页面.

Soultion Since The Register page was under Home controller, and the Register logic was in the Account controller i had to define the the view to load the Register.cshtml page.

[HttpPost]
public ActionResult Register(RegisterModel model){
    if (ModelState.IsValid){
        // Insert into database
    }
    // There was an error
    return View("~/Views/Home/Register.cshtml",model)
}

推荐答案

当您单击提交"按钮时，它会将表单发布到服务器上，在该服务器上您的操作方法具有用于检查表单是否有效的代码(ModelState.IsValid) .这是服务器端验证.必须将表单发布到服务器上.

When you click on the submit button, it posts the form to the server where your action method has code to check whether the form is valid ( ModelState.IsValid). This is server side validation. The form has to be posted to server for this to happen.

如果您希望在客户端进行验证(如果验证失败则不要提交表单)，则需要确保已将相关的javascript库/文件加载到页面上.

If you want to the validation to happen at client side (and not submit the form if the validation fails), you need to make sure that you have the relevant javascript libraries/files loaded to your page.

1. jquery.validate.js
2. jquery.validate.unobtrusive.js

您可以将它们包括在布局文件或特定视图中.如果是特定视图，请确保将其包含在按揭"部分中.

You may include those in your layout file or your specific view. If it is the specific view, make sure you include those in the Scrips section.

@section Scripts
{
 <script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
 <script src="~/lib/jquery-validation- unobtrusive/jquery.validate.unobtrusive.js"></script>
}

更新文件的路径，以使其与项目中这些文件的位置匹配.您也可以使用该位置访问公共CDN.

Update the path of the files to match with where you have those files in your project. You may also use the location to a public cdn.

这篇关于表单模型在POST之前未通过验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！