jQuery自定义属性的不显眼的客户端验证

我已经创建了一个自定义验证属性,它在服务器端工作(在表单发布后)但我无法让验证工作在客户端.

自定义属性是：

public class ReasonableAttribute : ValidationAttribute,IClientValidatable
{
    public override bool IsValid(object value)
    {
        return Approval.IsNumberReasonable(value.ToString());
    }

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata Metadata,ControllerContext context)
    {
        ModelClientValidationRule rule = new ModelClientValidationRule();
        rule.ErrorMessage = FormatErrorMessage(Metadata.GetDisplayName());
        rule.ValidationType = "reasonable";
        yield return rule;
    }

}

IsNumberReasonable()函数只是对字段输入进行一些检查,以确保它们输入的内容可以合理地为批准号(例如,不为空,或“未知”或类似的东西)返回bool true / false.

我的模型然后包含：

[Display(Name = "Approval Number"]
[Reasonable(ErrorMessage = "Please enter a reasonable {0}")]
public String ApprovalNumber { get; set; }

并且视图包含：

@Html.LabelFor(model => model.ApprovalNumber,new { @class = "control-label col-md-3" })
<div class="col-md-9 append field">
 @Html.TextBoxFor(model => model.ApprovalNumber,new { @class = "input text" })
 @Html.ValidationMessageFor(model => model.ApprovalNumber)
</div>

在我尝试添加的JavaScript中：

$.validator.unobtrusive.adapters.addBool("reasonable","required");
// OR
$.validator.unobtrusive.adapters.add("reasonable");

和:(在document.ready之外)

(function ($) {
            $.validator.addMethod('reasonable',function (value,element,params) {
                return value != '';
            },'Clientside Should Not Postback');
            $.validator.unobtrusive.adapters.addBool('reasonable');
        })(jQuery);

各种组合,但无法使其工作.

我有

<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>

包含在视图中.

提交表单时,客户端验证适用于其他字段(必需的等),但ApprovalNumber旁边的验证消息从未出现/不执行我的自定义验证.

任何指向正确方向的人都会受到赞赏.@H_502_35@谢谢.

我也有

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

已经在Web.config文件中.

编辑2：@H_502_35@根据chenZ的帖子：@H_502_35@输入字段的html是：

<input class="input text valid" data-val="true" data-val-reasonable="Please enter a reasonable Approval Number" data-val-required="Approval Number is required." id="ApprovalNumber" name="ApprovalNumber" type="text" value="">

尝试更新我的视图底部：

<script src="~/Scripts/jquery.validate.js"></script>
<script type="text/javascript">
    (function ($) {
        $.validator.addMethod('reasonable',params) {
            return value != '';
        },'Clientside Should Not Postback');
    })(jQuery);
    </script>

    <script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/Create.js"></script>

jquery.validate.unobtrusive.js的结尾现在包含：

$(function () {
        $.validator.unobtrusive.adapters.addBool('reasonable');
        $("#formID").removeData("unobtrusiveValidation").removeData("validator");
        $jQval.unobtrusive.parse(document);
    });
}(jQuery));

和create.js包含：

$.validator.unobtrusive.adapters.addBool("mandatory","required"); // another custom attribute for checkBox validation
    var v = $("#formID").validate({
        errorClass: "warning",onkeyup: false,onblur: false,});

v变量进一步用于提交按钮：

$("#SubmitButton").click(function () {
    if (v.form()) {
          // The form passed validation so continue..
        } else {
            // Validation Failed,do something else..
        }
});

我做了一些进一步的测试,似乎与以下内容有关：

(function ($) {
            $.validator.addMethod('reasonable','Clientside Should Not Postback');
        })(jQuery);

当我把它改为：

(function ($) {
            $.validator.addMethod('reasonable',params) {
                return value != 'unkNown';
            },'Clientside Should Not Postback');
        })(jQuery);

它有效,但只有当我在输入框中输入’unkNown’时,其他任何东西都会通过..类似的,如果我把返回值！=’jhdsfkhsdkfj’;它只在我输入jhdsfkhsdkfj时验证.

所以它似乎正在使用它作为规则？而不是我的服务器端IsNumberReasonable()函数.

希望有助于排除故障.

$.each(this.adapters,function () {
            var prefix = "data-val-" + this.name,

$(function () {
    $jQval.unobtrusive.parse(document);
});

<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
.....
(function ($) {
        $.validator.addMethod('reasonable','Clientside Should Not Postback');
        $.validator.unobtrusive.adapters.addBool('reasonable');
    })(jQuery);

<script src="~/Scripts/jquery.validate.js"></script>
(function ($) {
        $.validator.addMethod('reasonable','Clientside Should Not Postback');
        $.validator.unobtrusive.adapters.addBool('reasonable');
    })(jQuery);
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>

<script src="~/Scripts/jquery.validate.js"></script>
(function ($) {
        $.validator.addMethod('reasonable','Clientside Should Not Postback');
    })(jQuery);
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>

$.validator.unobtrusive.adapters.addBool('reasonable');

$(function () {
    $jQval.unobtrusive.parse(document);
});

$(function () {
    $("#formid").removeData("unobtrusiveValidation").removeData("validator");
    $.validator.unobtrusive.parse(document);
});

$("#a").validate({});//first time call is useful
$("#a").validate({});//second time call is useless

var validator = $.data( this[0],"validator" );
if ( validator ) {
    return validator;
}

result = $form.data(data_validation),...
    if (!result) { ....

<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/setting.js"></script>
<script>
  $(function(){ $("#formid").removeData(...).removeData(...); 
  ....unobtrusive.parse(document)});
</script>