【问题标题】:ASP.NET MVC 4 - Clientside Validation Not WorkingASP.NET MVC 4 - 客户端验证不起作用
【发布时间】:2013-03-20 16:41:37
【问题描述】:

我正在使用 Visual Studio 2012,我无法让自定义属性客户端逻辑工作 为了以更小规模重现,我创建了一个新的 MVC 4 项目,我创建了以下永远不会验证的模型和属性

public class MyModel
{
    public int Id { get; set; }
    [Required]
    public string LastName { get; set; }
    [NeverValid(ErrorMessage="Serverside Will Never Validate")]
    public string FirstName { get; set; }
}

public class NeverValidAttribute : ValidationAttribute, IClientValidatable
{
    public override bool IsValid(object value)
    {
        return false;
    }

    protected override ValidationResult IsValid(object value, ValidationContext validationContext)
    {
        return new ValidationResult(this.ErrorMessage, new[] { validationContext.MemberName });
    }

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        yield return new ModelClientValidationRule
        {
            ErrorMessage = this.ErrorMessage,
            ValidationType = "nevervalid"
        };
    }
}

然后我将以下操作添加到 HomeController

public ActionResult Index()
{
    return View(new MyModel());
}

[HttpPost]
public ActionResult Index(MyModel model)
{
    if (!ModelState.IsValid)
    {
        // Will Always Be Invalid
    }

    return View(model);
}

还有一个名为 nevervalid.js 的 javascript 文件

$(function () {
    $.validator.addMethod("nevervalid", function () {
        return false;
    }, "Clientside Should Not Postback");

    $.validator.unobtrusive.adapters.addBool("nevervalid");
});

和索引视图

@model CustomAttribute.Models.MyModel

@{
    ViewBag.Title = "Home Page";
}

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>MyModel</legend>

        @Html.HiddenFor(model => model.Id)

        <div class="editor-label">
            @Html.LabelFor(model => model.LastName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.LastName)
            @Html.ValidationMessageFor(model => model.LastName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.FirstName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.FirstName)
            @Html.ValidationMessageFor(model => model.FirstName)
        </div>

        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
}

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

我的 web.config 中的相关区域如下所示

<appSettings>
    <add key="webpages:Version" value="2.0.0.0" />
    <add key="webpages:Enabled" value="false" />
    <add key="PreserveLoginUrl" value="true" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

当页面加载时,会加载以下文件(从 chrome 的 F12 下的网络选项卡中获取)

http://localhost:7440/
http://localhost:7440/Content/site.css
http://localhost:7440/Scripts/modernizr-2.5.3.js
http://localhost:7440/Scripts/jquery-1.7.1.js
http://localhost:7440/Scripts/jquery.unobtrusive-ajax.js
http://localhost:7440/Scripts/jquery.validate.js
http://localhost:7440/Scripts/jquery.validate.unobtrusive.js
http://localhost:7440/Scripts/nevervalid.js

我的自定义属性将相关的外观数据添加到名字输入中,就像这样......

    <input class="text-box single-line valid" data-val="true" data-val-nevervalid="Serverside Will Never Validate" id="FirstName" name="FirstName" type="text" value="">

所以,我问你,为什么这东西必须回发才能进行服务器端验证,而我这里有一些看起来很完美的 javascript 代码?我必须在某个没有月亮的夜晚在山顶某处牺牲一些动物吗?

【问题讨论】:

  • 这有帮助吗,看来您没有覆盖验证属性中的所有必需功能。 stackoverflow.com/questions/8284207/…
  • 嗨,Patrick,感谢您抽出宝贵的时间来查看问题,在我急于获得最小的可重现代码时,我忽略了第二个 IsValid 覆盖...仍然无法正常工作...我想我一定已经完成了所有相关的 SO 问题。但是什么都没有...我希望有人能够在世界末日重现它,请确认我不会发疯...

标签: jquery asp.net asp.net-mvc-4 jquery-validate unobtrusive-validation


【解决方案1】:

我想知道如果您更改 nevervalid.js 以在文档准备好之前执行代码会发生什么。

我的基本想法是,当 dom 准备好时,通过解析文档来进行不显眼的验证......但如果您同时/之后加载自定义验证内容,它不知道什么时候该做什么它出现在您的自定义验证数据属性中。

无论如何,尝试将 nevervalid.js 更改为:

(function($) {
    $.validator.addMethod("nevervalid", function () {
        return false;
    }, "Clientside Should Not Postback");

    $.validator.unobtrusive.adapters.addBool("nevervalid");
})(jQuery);

【讨论】:

  • 是的,仍然有效,而且编辑看起来确实不那么“赤裸”了,使用 jQuery 太久了,其中有一些东西我忘了问它们的真正含义......跨度>
  • 一切都好,很高兴它解决了你的问题。编辑只是一个最佳实践:-)
  • 谁能帮我看看 (function($){})(jQuery) 和 $(document).ready(function{}) 有什么区别??
  • $(document).ready(function{}) 在文档准备好时被调用(一切都已加载,圆顶准备好了等等等等……)(function($){})(jQuery)遇到它会立即被触发,它基本上只是使用 jQuery 作为参数立即调用 function($){}...希望它有意义
  • 非常感谢@Charlino 经过多次努力,您的回答对我非常有用。我希望我能给你更多的投票来支持你的回答。
猜你喜欢
  • 2014-08-02
  • 1970-01-01
  • 2013-01-09
  • 2014-03-25
  • 1970-01-01
  • 2011-12-19
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多