Проверка мастера формы jquery

Я пытаюсь реализовать сценарий проверки (bassistance) с помощью мастера форм jquery (http://www.jankoatwarpspeed.com/post/2009/09/28/webform-wizard-jquery.aspx), но у меня возникли некоторые проблемы.

На странице мастера jquery парень по имени «Томми» придумал фрагмент кода, чтобы реализовать басистость с кодом. Но по какой-то причине я не могу заставить его работать. Появляется сообщение, что если поле необходимо заполнить и т. д., а следующая кнопка не работает - это нормально, НО, если я заполню все поля, следующая кнопка все равно не работает.

function createNextButton(i) {

            var stepName = "step" + i;
            $("#" + stepName + "commands").append("<a href='#' id='" + stepName + "Next' class='next'>Next ></a>");

            /* VALIDATION */
            if (options.validationEnabled) {
                var stepIsValid = true; 
                $("#" + stepName + " :input").each(function(index) { 
                    stepIsValid = !element.validate().element($(this)) && stepIsValid;
                });
                if (!stepIsValid) {
                    return false; 
                }
            }
            /* END VALIDATION */

            $("#" + stepName + "Next").bind("click", function(e) {
                $("#" + stepName).hide();
                $("#step" + (i + 1)).show();
                if (i + 2 == count)
                    $(submmitButtonName).show();
                selectStep(i + 1);
            });

        }

Может ли кто-нибудь помочь мне разобраться в этом? :)


person SoulieBaby    schedule 12.01.2010    source источник


Ответы (2)


Хорошо, поэтому я добавил проверку к событию щелчка и понял, что «element.validate().element($(this)) && stepIsValid» действительно существует. Если кто-то еще использует это и имеет ту же проблему, решение является:

/* VALIDATION */
                if (options.validationEnabled) {
                    var stepIsValid = true;
                    $("#"+stepName+" :input").each(function(index) {
                        checkMe = element.validate().element($(this));
                        //stepIsValid = !element.validate().element($(this)) && stepIsValid;
                        stepIsValid = checkMe && stepIsValid;
                    });
                    //alert("stepIsValid === "+stepIsValid);
                    if (!stepIsValid) {
                        return false;
                    };
                }; 
                /* END VALIDATION */
person SoulieBaby    schedule 12.01.2010

Попробуйте добавить проверку в событие клика

function createNextButton(i) {
    var stepName = "step" + i;
    $("#" + stepName + "commands").append("<a href='#' id='" + stepName + "Next' class='next'>Next ></a>");

    $("#" + stepName + "Next").bind("click", function(e) {
        /* VALIDATION */
        if (options.validationEnabled) {
            var stepIsValid = true; 
            $(this).closest("fieldset").find(":input").each(function(index) { 
                stepIsValid = element.validate().element($(this)) && stepIsValid;
            });
            if (!stepIsValid) {
                return false; 
            }
        }
        /* END VALIDATION */

        $("#" + stepName).hide();
        $("#step" + (i + 1)).show();
        if (i + 2 == count)
            $(submmitButtonName).show();
        selectStep(i + 1);
    });
}

Обновить

ИЛИ... Попробуйте снять флажок по умолчанию с флажка Получать информационные бюллетени? (по умолчанию снят). Событие щелчка не привязывается к следующей кнопке, потому что флажок требуется и установлен, поэтому stepIsValid имеет значение false, а createNextButton возвращает значение false перед привязкой события щелчка.

person Alpha Codemonkey    schedule 12.01.2010
comment
Неее, тоже не работает. Сначала я получил ошибку для $(this).closest.. поэтому я изменил его на исходный код проверки, и он показывает, какие поля требуются, когда вы нажимаете «Далее», но как только вы заполняете поля и снова нажимаете «Далее», это не ничего не делай.. - person SoulieBaby; 13.01.2010