c#javascript mvc-javascript window.conf框集在模型验证后出现

c# javascript mvc - Javascript window.confirm Box set appear after model validation

本文关键字：验证 模型 mvc-javascript window conf c#javascript      更新时间：2023-09-26

我的MVC项目中有一个场景。

我有这个模型，以每个属性的"Required"验证为例。

public class ResetPasswordViewModel
{
    [Required]
    public string UserName { get; set; }
    [Required]
    public string Password { get; set; }
    [Required]
    public string NewPassword { get; set; }
    [Required]
    [Compare("NewPassword", ErrorMessageResourceType = typeof(Resources.localize), ErrorMessageResourceName = "ErrorMessagePasswordNotMatch")]
    public string ConfirmPassword { get; set; }
}

我的视图中有一个HTML表单，类似于这个

@using (Html.BeginForm("register", "account", FormMethod.Post, new { data_ajax = "false", id = "loginForm" }))
{
@Html.ValidationSummary()
<ul data-role="listview" data-inset="true">
    <li data-role="list-divider">@Resources.localize.AccountDetails</li>
    <li data-role="fieldcontain">
        @Html.LabelFor(m => m.UserName)
        @Html.TextBoxFor(m => m.UserName)            
    </li>
    <li data-role="fieldcontain">
        @Html.LabelFor(m => m.Password)
        @Html.PasswordFor(m => m.Password)            
    </li>
    <li data-role="fieldcontain">
        @Html.LabelFor(m => m.NewPassword)
        @Html.PasswordFor(m => m.NewPassword)
    </li>
    <li data-role="fieldcontain">
        @Html.LabelFor(m => m.ConfirmPassword)
        @Html.PasswordFor(m => m.ConfirmPassword)
    </li>
    <li data-role="fieldcontain">
        <input data-ajax="false" type="submit" value="Login" />
    </li>
</ul>
}

当我通过单击登录按钮提交表单时，我想添加一个window.conf框，并且我希望只有当表单在模型验证中有效时，window.conf才会触发。

当我简单地在"登录"按钮上设置window.conf时，无论表单是否有效，它都将首先触发。

有没有可能做到，window.conf只有在表单有效后才会出现？（不使用任何jQuery验证器）

您可以像一样在页面中使用Jquery validate.js

然后使用

$("input[type='submit']").on("click", function(){  
   var isValid = $("#loginForm").valid();
   if(isValid){
      var isConfirm = confirm("Are you sure you want to proceed?");
      if(!isConfirm){
        return false;
      }
    }
});
相关文章：