Bonjour tout le monde.

J'aurai besoin de votre aide pour modifier un script Jquery que j'ai trouver sur internet. Je n'ai pas beaucoup de base en JQuery, et donc modifier ce script m'est impossible.

Je vous explique ce que je cherche:

En faite, le script actuel me permet de naviguer dans les différentes parties d'un formulaire, les différentes étapes, et d'en afficher les boutons en conséquences, tels que Suivant et Précédent.

Je voudrais lui apporter une modification pour qu'une fois sur la dernière étape du script, le bouton Suivant soit remplacer par un bouton submit, histoire de pouvoir récupérer mes POST et afficher un récapitulatif.

En gros, le squelette que je recherche:

Étape 1 du form: Suivant

Étape 2 du form: Submit ou Précédent.

J'espère être assez clair.

Voilà le script:

Code Javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
 
/* Created by jankoatwarpspeed.com */
 
(function($) {
    $.fn.formToWizard = function(options) {
        options = $.extend({  
            submitButton: "" 
        }, options); 
 
        var element = this;
 
        var steps = $(element).find("fieldset");
        var count = steps.size();
        var submmitButtonName = "#" + options.submitButton;
        $(submmitButtonName).hide();
 
        // 2
        $(element).before("<ul id='steps'></ul>");
 
        steps.each(function(i) {
            $(this).wrap("<div id='step" + i + "'></div>");
            $(this).append("<p id='step" + i + "commands'></p>");
 
            // 2
           /* var name = $(this).find("legend").html();
            $("#steps").append("<li id='stepDesc" + i + "'>Étape  " + (i + 1) + " <span> " + name + " </span></li>");
            */
            if (i == 0) {
                createNextButton(i);
                selectStep(i);
            }
            else if (i == count - 1) {
                $("#step" + i).hide();
                createPrevButton(i);
            }
            else {
                $("#step" + i).hide();
                createPrevButton(i);
                createNextButton(i);
            }
        });
 
        function createPrevButton(i) {
            var stepName = "step" + i;
            $("#" + stepName + "commands").append("<button><a href='#' id='" + stepName + "Prev' class='prev'> < Précédent   </a></button>");
 
            $("#" + stepName + "Prev").bind("click", function(e) {
                $("#" + stepName).hide();
                $("#step" + (i - 1)).show();
                $(submmitButtonName).hide();
                selectStep(i - 1);
            });
        }
 
        function createNextButton(i) {
            var stepName = "step" + i;
            $("#" + stepName + "commands").append("<button><a href='#' id='" + stepName + "Next' class='next'>   Suivant > </a></button>");
 
            $("#" + stepName + "Next").bind("click", function(e) {
                $("#" + stepName).hide();
                $("#step" + (i + 1)).show();
                if (i + 2 == count)
                    $(submmitButtonName).show();
                selectStep(i + 1);
            });
        }
 
        function selectStep(i) {
            $("#steps li").removeClass("current");
            $("#stepDesc" + i).addClass("current");
        }
 
    }
})(jQuery);

Pour ceux qui se demandent, c'est le script formToWizard créé par Janko, qui permet de transformer un formulaire simple en plusieurs étapes en fonction des fieldset.

Merci pour ceux qui m'aideront.