客户端验证在ASP.NET Core MVC应用程序中不起作用

时间:2018-04-09 10:11:10

标签: asp.net-mvc asp.net-core-mvc asp.net-core-2.0

我的登录页面有以下型号:

public class LoginViewModel : BaseViewModel
{
    public LoginFormViewModel Form { get; set; }
}
public class LoginFormViewModel
{
    [Required]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.Password)]
    public string Password { get; set; }

    [Required]
    public bool RememberMe { get; set; }
}

这是页面html:

@model SocialNetwork.Web.ViewModels.LoginViewModel

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

<h2>Login</h2>

<style>
    #btn-login {
        float: left;
        margin-left: 14px;
    }

    #checkbox-remember-me {
        margin-right: 15px;
    }
</style>

<div class="col-md-offset-2 col-md-4">
    <form asp-action="Login">
        <div class="row">
            <div>
                <div class="form-group col-md-12">
                    <label asp-for="Form.UserName"></label>
                    <input asp-for="Form.UserName" name="UserName" class="form-control">
                    <span asp-validation-for="Form.UserName"></span>
                </div>
            </div>
        </div>
        <div class="row">
            <div>
                <div class="form-group col-md-12">
                    <label asp-for="Form.Password"></label>
                    <input asp-for="Form.Password" name="Password" class="form-control">
                    <span asp-validation-for="Form.Password"></span>
                </div>
            </div>
        </div>
        <div asp-validation-summary="All"></div>
        <div class="row">
            <div class="checkbox pull-right" id="checkbox-remember-me">
                <label>
                    <input asp-for="Form.RememberMe" name="RememberMe">
                    Remember me
                </label>
            </div>
            <button type="submit" id="btn-login" class="btn btn btn-primary">
                Log In
            </button>
        </div>
    </form>
</div>

客户端验证根本不起作用,那些<span asp-validation-for="some-property"></span>根本不起作用;但<div asp-validation-summary="All"></div>会在页面刷新时执行。

我的_Layout.cshtml中几乎没有任何改变。我确信Login.cshtml顶部的那些脚本位于该文件夹中,并且它们被包含在内。

控制器中的表单操作将LoginFormViewModel作为它的参数,它就可以了。

我已经覆盖了这个名称,因为否则,表单并没有被绑定到表单子目录上的模型。 Model.Form.Password的名称是Form_Password,它无法将其映射到子模型中的模型中,因为在模型中它只被称为密码。 所以,我想这肯定是个问题,所以在提交时必须有另一种方法将该表单映射到它的模型,对吗?

2 个答案:

答案 0 :(得分:0)

不确定您获取Form.Property的位置,但这是它的工作方式

但模型看起来应该是

public class LoginViewModel : BaseViewModel
{    
    [Required]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.Password)]
    public string Password { get; set; }

    [Required]
    public bool RememberMe { get; set; }
}

以及相关的html

<form asp-route-returnurl="@ViewData["ReturnUrl"]" method="post">
            <h4>Use a local account to log in.</h4>
            <hr />
            <div asp-validation-summary="All" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="UseName"></label>
                <input asp-for="UserName" class="form-control" />
                <span asp-validation-for="UserName" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Password"></label>
                <input asp-for="Password" class="form-control" />
                <span asp-validation-for="Password" class="text-danger"></span>
            </div>
            <div class="form-group">
                <div class="checkbox">
                    <label asp-for="RememberMe">
                        <input asp-for="RememberMe" />
                        @Html.DisplayNameFor(m => m.RememberMe)
                    </label>
                </div>
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-default">Log in</button>
            </div>

        </form>

asp-tag帮助程序使用您在视图中使用的模型的属性..

答案 1 :(得分:0)

确保添加

public MyCommentAdapter(Context context, List<MyComment> commentList) 
{
this.context = context;
this.customSharedPrefernces = new CustomSharedPreferences(context);
this.commentList = commentList;
}