Блог

Я хочу отключить кнопку «далее», если поля не заполнены на шаге мастера форм. Я не знаю объект .step в глубине, и мне не хватает этого шага. Вот мой код:

  //Sauvegarder les informations pour finaliser la création du compte de l'usager
   $(".icons-tab-steps").steps({

    headerTag: "h6",
    bodyTag: "fieldset",
    transitionEffect: "fade",
    titleTemplate: '<span class="step">#index#</span> #title#',
    labels: {
        finish: submitButton,
        next: nextButton,
        previous: prevButton
    },
    onFinished: function (event, currentIndex) {
        $('body').addClass('loading');
        var userName = $("#editRandomMp").find("#userName").val();
        var vieuxMp = $("#viewMp").val();
        var nouveauMp = $("#nouveauMp").val();
        var urlDefaut = $("#pageAccueilSelect").val();

        var jsonData = JSON.stringify({ userName: userName, vieuxMp: vieuxMp, nouveauMp: nouveauMp, urlDefaut: urlDefaut });
        $.ajax({
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            type: 'POST',
            url: '/Compte/FinaliserCompte',
            data: jsonData,
            success: function (data, textStatus, jqXHR) {
                if (data.code == 0) {
                    ModificationSucces(data);
                }
                else {
                    ModificationErreur(data);
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                ModificationErreur({ code: jqXHR.status, message: ModalLabel.ErreurTechnique, data: [{ jqXHR: jqXHR, error: errorThrown }] });
            }
        });
    }
});
 

Обновить//////////

Покопавшись, я нашел части решения, которые помогли мне сделать то, что я хотел сделать, я поместил свой длинный фрагмент кода здесь, если это может помочь кому-то еще.

Это новый код(я не извлекал функции для отображения от начала до конца):

 //Paramètres pour le wizard form dans le modal #finaliserCompteModal

$(".icons-tab-steps").steps({

    headerTag: "h6",
    bodyTag: "fieldset",
    transitionEffect: "fade",
    titleTemplate: '<span class="step">#index#</span> #title#',
    labels: {
        finish: submitButton,
        next: nextButton,
        previous: prevButton
    },
    onStepChanging: function (event, currentIndex, newIndex) {
        currentStep = currentIndex;

        if (newIndex < currentIndex) {
            return true;
        }
        
        if (currentStep === 0) {
            var txtOldPwd = $('#vieuxMp').val();
            var txtPwd = $('#nouveauMp').val();
            var txtPwdConfirm = $('#confirmMP').val();

            var aLettres = new Array();
            aLettres.push("a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z");

            var bValide = false;
            var sMotPasse = txtPwd.toLowerCase();

            // Vérification de l'alphanumérique
            for (var i = 0; i < aLettres.length; i  ) {
                if (sMotPasse.indexOf(aLettres[i]) != -1) {
                    bValide = true;
                    i = aLettres.length   1;
                }
            }

            if (bValide) {
                for (var i = 0; i <= 9; i  ) {
                    if (sMotPasse.indexOf(i.toString()) != -1) {
                        bValide = true;
                        i = 10;
                    }
                    else { bValide = false; }
                }
            }

            if (bValide) {
                for (var i = 0; i < aLettres.length; i  ) {
                    var reg = new RegExp("("   aLettres[i]   ")", "gi");
                    sMotPasse = sMotPasse.replace(reg, "");
                }
                for (var i = 0; i <= 9; i  ) {
                    var reg = new RegExp("("   i.toString()   ")", "gi");
                    sMotPasse = sMotPasse.replace(reg, "");
                }
                if (sMotPasse.length > 0) { bValide = false; }
            }

            if (txtOldPwd == "") {

                alertMessage = "Entrez votre mot de passe actuel";
                sweetAlertInput(alertMessage);

                return false;
            }

            if (txtPwd == "") {

                alertMessage = "Entrez un mot de passe";
                sweetAlertInput(alertMessage);
                txtPwd = txtPwdConfirm = "";

                return false;
            }

            if (txtPwd.length < 6 || !bValide) {

                alertMessage = "Le mot de passe doit contenir nun minimum de 6 caractères (alphabétiques et numériques).nn* Exemple : 9c45Ep28";
                sweetAlertInput(alertMessage);
                txtPwd = txtPwdConfirm = "";
                
                return false;
            }

            if (txtPwdConfirm == "") {

                alertMessage = "Confirmez le mot de passe";
                sweetAlertInput(alertMessage);

                return false;
            }

            if (txtPwd != txtPwdConfirm) {

                alertMessage = "La confirmation ne correspond pas avec le mot de passe";
                sweetAlertInput(alertMessage);

                return false;
            }else {
                return true;
            }
        }
        if (currentStep === 1) {
            if ($('#pageAccueilSelect').val()) {
                return true;
            }
        }
        else {
            return false;
        }

    },
    onFinished: function (event, currentIndex) {
        //Sauvegarder les informations pour finaliser la création du compte de l'usager
        var inputOk = true;
        var userName = $("#finaliserCompteModal").find("#userName").val();
        var vieuxMp = $("#finaliserCompteModal").find("#vieuxMp").val();
        var nouveauMp = $("#finaliserCompteModal").find("#nouveauMp").val();
        var urlDefaut = $("#finaliserCompteModal").find("#pageAccueilSelect").val();
        var telephone = $("#finaliserCompteModal").find("#telephone").val();
        var email = $("#finaliserCompteModal").find("#email").val();
        var fonctionTravail = $("#finaliserCompteModal").find("#fonctionTravail").val();
        var lieuTravail = $("#finaliserCompteModal").find("#lieuTravail").val();
        var sexe = "";
        if ($('input[name="sexe"]').is(':checked')) {
            sexe = $("#finaliserCompteModal").find('input[name="sexe"]:checked').val();
        }

        if (telephone == "") {
            alertMessage = "Entrez le numéro de téléphone";
            sweetAlertInput(alertMessage);
          
            return false;
        }
        if (email == "") {

            alertMessage = "Entrez l'adresse de courrier électronique";
            sweetAlertInput(alertMessage);

            return false;
        }
        if (fonctionTravail == "") {

            alertMessage = "Entrez la fonction de travail";
            sweetAlertInput(alertMessage);
           
            return false;
        }
        if (lieuTravail == "") {

            alertMessage = "Entrez le lieu de travail";
            sweetAlertInput(alertMessage);
          
            return false;
        }
        if (sexe == "") {

            alertMessage = "Sélectionnez le sexe";
            sweetAlertInput(alertMessage);
            
            return false;
        }

        if (inputOk) {
            $('body').addClass('loading');
            var userName = $("#finaliserCompteModal").find("#userName").val();
            var vieuxMp = $("#finaliserCompteModal").find("#vieuxMp").val();
            var nouveauMp = $("#finaliserCompteModal").find("#nouveauMp").val();
            var urlDefaut = $("#finaliserCompteModal").find("#pageAccueilSelect").val();
            var telephone = $("#finaliserCompteModal").find("#telephone").val();
            var email = $("#finaliserCompteModal").find("#email").val();
            var fonctionTravail = $("#finaliserCompteModal").find("#fonctionTravail").val();
            var lieuTravail = $("#finaliserCompteModal").find("#lieuTravail").val();
            var sexe = "";
            if ($('input[name="sexe"]').is(':checked')) {
                sexe = $("#finaliserCompteModal").find('input[name="sexe"]:checked').val();
            }

            var jsonData = JSON.stringify({ userName: userName, vieuxMp: vieuxMp, nouveauMp: nouveauMp, urlDefaut: urlDefaut, telephone: telephone, email: email, fonctionTravail: fonctionTravail, lieuTravail: lieuTravail, sexe: sexe });
            $.ajax({
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                type: 'POST',
                url: '/Compte/FinaliserCompte',
                data: jsonData,
                success: function (data, textStatus, jqXHR) {
                    if (data.code == 0) {
                        var alerteMsg = "";
                        if (currentLang == "fr") {
                            alerteMsg = "Votre action a été complété avec succès";
                        } else {
                            alerteMsg = "Your action has been successfully completed";
                        }
                        $('body').removeClass('loading');
                        setTimeout(function () {
                            window.location.href = ''   data.message   ''
                        }, 3000);
                        sweetAlert({
                            title: '',
                            text: ''   alerteMsg   '',
                            timer: 3000,
                            type: "success",
                            showCancelButton: false,
                            showConfirmButton: false
                        });
                    }
                    else {
                        ModificationErreur(data);
                    }
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    ModificationErreur({ code: jqXHR.status, message: erreurTech, data: [{ jqXHR: jqXHR, error: errorThrown }] });
                }
            });
        } 
    }
});