Bonsoir � tous, j'ai un petit probl�me avec du code javascript.
Petite explication, je r�alise un formulaire pour des r�servations d'un repas. Lorsque l'utilisateur change son nombre d'invit�s je modifie la suite du formulaire pour qu'il choisisse le menu pour chacun de ses invit�s (choix entre deux menus).
Jusque l� pas de probl�me : je r�cup�re tr�s bien ce nombre avec jquery puis commence la manipulation du DOM.
Je cr�e un <div> � l'int�rieur duquel je vais stocker des boutons radio.
J'initialise tous les nouvelles �l�ments dont je vais avoir besoin et je les ins�res en tant que fils de <div>.
Au final ce que j'aimerais obtenir, c'est:
Probl�me, le script est extr�mement lent et ne fonctionne que pour l'ajout d'un invit�. J'ai essay� de bouger la cr�ation des nouveaux �l�ments en-dehors de ma boucle "for" mais le r�sultat est le m�me. Donc je s�che sur la nature de l'erreur. Si quelqu'un � une petite id�e pour me faire avancer, je lui en serais tr�s reconnaissant.
Code : S�lectionner tout - Visualiser dans une fen�tre � part
1
2
3
4
5
6
7
8
9
10 <div> <span>1er invité</span> <label>...</label> <input type="radio"/> ... <span>Dernier invité</span> <label>...</label> <input type="radio"/> </div>
Question subsidiaire : je souhaiterais que ce code soit portable (IE, Firefox, Opera, ...) qu'elles sont les choses � faire attentions?
Code : 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 //#Personne correspond à un <select> avec le nombre de d'invités $("#Personne").change(function () { $("#Invites").remove(); var nb_invites = parseInt($('#Personne :selected').val()); var new_menu_selection_div = document.createElement("div"); new_menu_selection_div.setAttribute("id", "Invites"); var new_invite_span = document.createElement("span"); var label_1_text = document.createTextNode("Menu 1"); var label_2_text = document.createTextNode("Menu 2"); var new_menu_selection_label_1 = document.createElement("label"); var new_menu_selection_radio_1 = document.createElement("input"); var new_menu_selection_label_2 = document.createElement("label"); var new_menu_selection_radio_2 = document.createElement("input"); //console.log(nb_invites); for( i=1; i<= nb_invites; i++ ){ if(i=1) var span_text = document.createTextNode("Menu pour le 1er invit\351 :"); else var span_text = document.createTextNode("Menu pour le " + i + "e invit\351 :"); new_invite_span.appendChild(span_text); new_menu_selection_div.appendChild(new_invite_span); //var new_menu_selection_label_1 = document.createElement("label"); new_menu_selection_label_1.setAttribute("for", "Invite" + i); new_menu_selection_label_1.appendChild(label_1_text); new_menu_selection_div.appendChild(new_menu_selection_label_1); //var new_menu_selection_radio_1 = document.createElement("input"); new_menu_selection_radio_1.setAttribute("type", "radio") ; new_menu_selection_radio_1.setAttribute("name", "Invite" + i) ; new_menu_selection_radio_1.setAttribute("value", "Menu1") ; new_menu_selection_div.appendChild(new_menu_selection_radio_1); //var new_menu_selection_label_2 = document.createElement("label"); new_menu_selection_label_2.setAttribute("for", "Invite" + i); new_menu_selection_label_2.appendChild(label_2_text); new_menu_selection_div.appendChild(new_menu_selection_label_2); //var new_menu_selection_radio_2 = document.createElement("input"); new_menu_selection_radio_2.setAttribute("type", "radio") ; new_menu_selection_radio_2.setAttribute("name", "Invite" + i) ; new_menu_selection_radio_2.setAttribute("value", "Menu2") ; new_menu_selection_div.appendChild(new_menu_selection_radio_2); } $("#Personne").after(new_menu_selection_div); });
Partager