jquery – MVC 4客户端验证不工作

任何人都可以告诉我为什么客户端验证不工作在我的MVC 4应用程序。

_layout.schtml

@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts",required: false)

在我的web.config我有：

<appSettings>
   <add key="ClientValidationEnabled" value="true" />
   <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

在我的login.cshtml页面我有：

@using (Html.BeginForm())
{
    <div class="formscontent">

        <ol>
            <li>
                @Html.LabelFor(x => x.AgreementNumber)
                <br />
                @Html.TextBoxFor(x => x.AgreementNumber,new { size = "30" })
                <br />
                @Html.ValidationMessageFor(m => m.AgreementNumber)
                <br />
                <br />
            </li>
            <li>
                @Html.LabelFor(x => x.UserName)
                <br />
                @Html.TextBoxFor(x => x.UserName,new { size = "30" })
                <br />
                @Html.ValidationMessageFor(m => m.UserName)
                <br />
                <br />
            </li>
            <li>
                @Html.LabelFor(x => x.Password)
                <br />
                @Html.PasswordFor(x => x.Password,new { size = "30" })
                <br />
                @Html.ValidationMessageFor(m => m.Password)
                <br />
                <br />
            </li>
        </ol>

    </div>

    <ol>
        <li>
            @Html.CheckBoxFor(m => m.RememberMe)
            @Html.LabelFor(m => m.RememberMe,new { @class = "checkBox" })
        </li>
    </ol>

    <br />

    <input class="mainbutton" type="submit" value="@Model.Localisation.TranslateHtmlString("logonBtn")" /><br />
    <div style="text-align: left; padding: 0 5px 5px 10px;">
        Forgot login-info? clik <a class="link" href="@Url.Action("Index","Credentials")">here.</a>
    </div>

}

在登录页面的底部：

@section Scripts {
  @Scripts.Render("~/bundles/jqueryval")
}

JavaScript在我的浏览器中启用。在MVC 4模板项目从Visual Studio客户端验证工作正常。

运行应用程序，在查看页面源时在登录页面上，我看到这个呈现：

<label for="AgreementNumber">number</label>
<br />
<input id="AgreementNumber" name="AgreementNumber" size="30" type="text" value="387893" />
<br />
<span class="field-validation-valid" data-valmsg-for="AgreementNumber" data-valmsg-  replace="true"></span>

并在此在底部：

<script src="/BMWebsite/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/BMWebsite/Scripts/jquery.validate.inline.js"></script>
<script src="/BMWebsite/Scripts/jquery.validate.js"></script>
<script src="/BMWebsite/Scripts/jquery.validate.unobtrusive.js"></script>

我的模型属性已注释：

public class logonModel : ModelBase
{
    [Myrequired("AgreementNumberrequiredProperty")]
    [MyDisplay("AgreementNumberLabel")]
    public string AgreementNumber { get; set; }

    [Myrequired("UserNamerequiredProperty")]
    [MyDisplay("UserNameLabel")]
    public string UserName { get; set; }

    [Myrequired("PasswordrequiredProperty")]
    [DataType(DataType.Password)]
    [MyDisplay("PasswordLabel")]
    public string Password { get; set; }

    [MyDisplay("RememberMeCheckBox")]
    public bool RememberMe { get; set; }
}

Myrequired是从常规requiredAttribute派生的类。原因是我的错误消息通过重写requiredAttribute类的FormatErrorMessage(string name)方法进行本地化。它工作正常 – 我的标签和错误消息是本地化。

Myrequired.cs

public class MyrequiredAttribute : requiredAttribute
{
    private readonly string _errorMessagekey;

    public MyrequiredAttribute(string errorMessage)
    {
        _errorMessagekey = errorMessage;
    }

    public override string FormatErrorMessage(string name)
    {
        var translation = HttpContext.Current.Session["translation"] as LocalisationHelper;

        return translation != null ? translation.Translate(_errorMessagekey) : ErrorMessage;
    }
}

我在我的登录操作方法的POST版本中放了一个断点，它被击中。表单发布到服务器端验证发生的服务器。客户端验证不会发生。

我缺少什么？

谢谢。

解决方法

我有同样的问题。看来，不显眼的验证脚本没有加载(见截图结束)。我通过在_Layout.cshtml的末尾添加来修复它

@Scripts.Render("~/bundles/jqueryval")

最终结果：

@Scripts.Render("~/bundles/jquery")
   @Scripts.Render("~/bundles/jqueryval")
   @RenderSection("scripts",required: false)

除了我漂亮的标准CRUD视图一切都是Visual studio项目模板默认值。

修复问题后加载脚本：

jquery – MVC 4客户端验证不工作

解决方法

猜你在找的jQuery相关文章