Question

我正在为标签式JQuery Ui表单编写验证例程。后面的代码是ASP.net，我想在用户点击链接上的“保存更改”时触发后面的代码中的函数。

为此，我隐藏了一个带有onclick链接的按钮，该按钮指向选项卡验证时单击的功能。但是出于某种原因，onclick不会触发（即使我按下按钮并自己点击它）。

我认为这是因为我的验证功能。我有一个更简单的版本，但我想使用这个版本，因为它突出显示有验证问题的选项卡。我的代码是......

 $(function () {
        $("#tabs").tabs();
    });

    $(document).ready(function () {
        $("#tabs :input").attr("disabled", true);

    });

    $("##ctl00_ContentPlaceHolder1_submitButton").button();

    $(document).ready(function () {
        $("#updateLink").click(function () {
            if ($("#updateLink").text() == 'CLICK TO EDIT') {
                $("#updateLink").text("SAVE CHANGES")
                toEditMode();
            } else {

                if ($("#aspnetForm").valid()) {
                    $("#aspnetForm").submit();
                    $("#ctl00_ContentPlaceHolder1_submitButton").click();
                    $("#updateLink").text("CLICK TO EDIT")
                    toDisplayMode();
                }
            }
        });
    });
    function toEditMode() {
        $('#tabs :input').removeAttr('disabled');
    }
    function toDisplayMode() {
        $("#tabs :input").attr("disabled", true);
    }

    $("#aspnetForm").validate({
        submitHandler: function (form) {
            alert("submitted!");
        },
        invalidHandler: function (form, validator) {
            var errors = validator.numberOfInvalids();
            if (errors) {
                var invalidPanels = $(validator.invalidElements()).closest(".ui-tabs-panel", form);
                if (invalidPanels.size() > 0) {
                    $.each($.unique(invalidPanels.get()), function () {
                        $(this).siblings(".ui-tabs-nav")
        .find("a[href='#" + this.id + "']").parent().not(".ui-tabs-selected")
          .addClass("ui-state-error")
          .show("pulsate", { times: 3 });
                    });
                }
            }
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).removeClass(errorClass);
            $(element.form).find("label[for=" + element.id + "]").removeClass(errorClass);
            var $panel = $(element).closest(".ui-tabs-panel", element.form);
            if ($panel.size() > 0) {
                if ($panel.find("." + errorClass + ":visible").size() == 0) {
                    $panel.siblings(".ui-tabs-nav").find("a[href='#" + $panel[0].id + "']")
      .parent().removeClass("ui-state-error");
                }
            }
        }
    });

Answer 1

事实证明，验证submitHandler导致了麻烦。通过删除它解决了这个问题。

JQuery验证打破了asp按钮onclick

1 个答案: