自定义验证无法使用Ajax MVC调用

时间:2012-01-18 13:03:48

标签: asp.net-mvc-3 jquery customvalidator

如果另一个表单在同一页面(不是ligthbox)中有效,则单击一个按钮我想要一个表单。该验证是我创建的自定义验证,并且工作正常。 这是视图中的代码

$("#btnSave").click(function (e) {

            if ($("#GeneralButtonFrm").valid()) {

                $("#ButtonFrm").submit();

            } else {
                //Error Message
            } });

问题是提交操作正在执行而不等待返回false的自定义验证的响应。

知道为什么会这样吗?

注意:我说我没有使用ligthbox呈现部分因为在这种情况下解决方案将是jQuery.validator.unobtrusive.parse('#form');

由于

1 个答案:

答案 0 :(得分:0)

在你的问题中,你仍然很模糊。但我认为你想要的是调用ajax并进行服务器端验证。如果是这样,问题是你的验证将在ajax请求之前返回,因为ajax请求是异步的。执行此操作

<html>
    <head>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
        <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.js"></script>
        <script type="text/javascript">
            jQuery.validator.addMethod("ajaxCustom", function (value, element) {
                var wrap = $(element);
                var url = wrap.data("customAjaxUrl");
                var result;

                $.ajax({
                    type: 'GET',
                    url: url,
                    dataType: 'json',
                    success: function (data) {
                       result  = data.valid;
                    },
                    data: { value: value, id: element.id },
                    async: false
                });

                return this.optional(element) || result;

            }, "Ajax");

            $.validator.unobtrusive.adapters.addBool('ajaxCustom');
            </script>
        <style type="text/css">
            .input-validation-error {
                background: red;
            }

        </style>

    </head>
    <body>

        <form action="/">
            <input data-val-ajaxCustom="Tuckel" data-val="true" data-val-required="Its required" data-custom-ajax-url="validate.html" />
            <button type="submit">Submit</button>
        </form>
    </body>
</html>