Bonjour.
Ci-dessous mon code HTML:
Ci-dessous mon code JavaScript (jQuery):
Code HTML : 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 <form id="formTest" action="#"> <div> <h3>Premier</h3> <section> <label for="choix1">Choix 1 *</label> <input id="choix1" name="choix1" type="select" class="required"> <label for="choix2">Choix 2 *</label> <input id="choix2" name="choix2" type="select" class="required"> <label for="pseudo">Pseudo *</label> <input id="pseudo" name="pseudo" type="text"> <p>(*) Obligatoire</p> </section> <h3>Deuxième</h3> <section> <label for="choix3">Choix 3 *</label> <input id="choix3" name="choix3" type="select" class="required"> <label for="choix4">Choix 4 *</label> <input id="choix4" name="choix4" type="select" class="required"> <label for="choix5">Choix 5 *</label> <input id="choix5" name="choix5" type="select" class="required"> <label for="address">Addresse</label> <input id="address" name="address" type="text"> <p>(*) Obligatoire</p> </section> <h3>Troisième</h3> <section> <ul> <li>1</li> <li>2</li> <li>3</li> </ul> </section> <h3>Fin</h3> <section> <p>Terminé</p> </section> </div> </form>
Le plugin Steps fonctionne bien, cependant quand je passe à l'étape 2, et les suivantes, les largeurs (width) des listes déroulantes, avec le plugin Chosen, sont égales à 0px, alors qu'à la première étape les largeurs ne sont pas affectées par ce problème.
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 jQuery(document).ready(function () { var form = $("#formTest"); form.validate({ errorPlacement: function errorPlacement(error, element) { element.before(error); }, rules: { confirm: { equalTo: "#password" } } }); form.children("div").steps({ headerTag: "h3", bodyTag: "section", transitionEffect: "slideLeft", onStepChanging: function (event, currentIndex, newIndex) { form.validate().settings.ignore = ":disabled,:hidden"; return form.valid(); }, onFinishing: function (event, currentIndex) { form.validate().settings.ignore = ":disabled"; return form.valid(); }, onFinished: function (event, currentIndex) { alert("Submitted!"); } }); $(".required").chosen({disable_search_threshold: 10}); });
Pourriez-vous, s'il plait, m'aider à résoudre ce problème?
Merci.
Partager