Bonjour,
J'essaye de modifier mon javascript afin d'y intégrer une bouche "For", ce qui m'éviterait d'avoir à créer une liste complète et très répétitive. Si cette liste ne changeait jamais, pas de souci, mais c'est tout l'inverse. En fait si j'ai besoin de cela c'est parce que la liste en question change très souvent (rajout, suppression et remplacement). Ces éléments sont contenus par un tableau. Chaque ligne contient un slide[x] (ici c'est le 6 comme exemple) qui comporte une série de liens vers des documents. Pour une plus grande facilité d'administration, chaque ligne est soské dans une base de donnée et appellée par le biaias d'une variable. Cela fonctionne parfaitement tant que je ne supprime pas de ligne dans la liste.
Les classes utilisées me sont imposées car dans un CMS et je n'ai pas accès au CSS. Chaque contenu de ligne (intitulé + Fx.Slide) est stocké dans une base de donnée pour administrer plus facilement la page HTMl qui les appèle. Ma question est la suivante: Comment pourrais-je ne remplacer le 6 qui est dans le code par une variable de boucle, ce qui m'évite de mettre la base de données et le JS à jour. J'ai essayé en faisaint une liste complète, anticipativement (Fx.Slide 0 à 68) et ça fonctionne parfaitement mais dés que je retire une ligne ou un Fx.Slide x ou y, c'est fichu et normal, tout reste ouvert. Logique puisque certains toggle status ne sont pas revoyés. le hic c'est que je n'arrive pas à contourner cela. Suis vraiment débutant en javascript du moins.
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 <div class="marginbottom"> Name and description of Item 6 <div id="vertical_slide6"><br /> <table border="0" align="center" cellspacing="0"> <tr><td colspan="2" class="p">Name : Item 6</td></tr> <tr><td colspan="2" class="p">Type : Documentation</td></tr> <tr><td colspan="2" class="p">Description : Full Tutorial 6</td></tr> <tr><td class="p">Document 6</td> <td class="p">Tutorial 6</td></tr> <tr><td class="p">Illustration 6</td> <td class="p">Album 6</td></tr> <tr><td class="p">Example 6.1</td> <td class="p">Example 6.2</td> </tr><tr><td class="p">Example 6.3</td> <td class="p"> </td></tr></table><br /> <div align="right">- Close</div></div></div>
1 à 5 dans la liste...
suppression item 6 par exemple
7 to 18 dans la liste...
Ci-dessous le js script:
Est-ce qu'à tout hasard quelqu'un pourrait m'aider ou a une idée pour mettre un for (for i=0; i<=18, i++) ou équivalent. J'ai déjà cherché dans la doc et dans certains tutoriaux mais sans succès. J'ai aussi déjà essayé, mais certainement mal, ne connaissant pas les fonctions et la nomenclature JS et Ajax. Ci-dessous ce que j'aimerais implémenter ou du même genre.
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 window.addEvent('domready', function() { var status = {'true': 'open','false': 'close'}; (....) 0 à 5 .... var myVerticalSlide6 = new Fx.Slide('vertical_slide6'); $('v_slidein6').addEvent('click', function(e){ e.stop();myVerticalSlide6.slideIn();}); $('v_slideout6').addEvent('click', function(e){ e.stop();myVerticalSlide6.slideOut();}); $('v_toggle6').addEvent('click', function(e){ e.stop();myVerticalSlide6.toggle();}); $('v_hide6').addEvent('click', function(e){ e.stop();myVerticalSlide6.hide(); $('vertical_status6').set('html', status[myVerticalSlide6.open]);}); $('v_show6').addEvent('click', function(e){ e.stop();myVerticalSlide6.show(); $('vertical_status6').set('html', status[myVerticalSlide6.open]);}); myVerticalSlide6.hide(); myVerticalSlide6.addEvent('complete', function() { $('vertical_status6').set('html', status[myVerticalSlide6.open]); }); (....) 7 à 18 .... var myVerticalSlide18 = new Fx.Slide('vertical_slide18'); $('v_slidein18').addEvent('click', function(e){ e.stop();myVerticalSlide18.slideIn();}); $('v_slideout18').addEvent('click', function(e){ e.stop();myVerticalSlide18.slideOut();}); $('v_toggle18').addEvent('click', function(e){ e.stop();myVerticalSlide18.toggle();}); $('v_hide18').addEvent('click', function(e){ e.stop();myVerticalSlide18.hide(); $('vertical_status18').set('html', status[myVerticalSlide18.open]);}); $('v_show18').addEvent('click', function(e){ e.stop();myVerticalSlide18.show(); $('vertical_status18').set('html', status[myVerticalSlide18.open]);}); myVerticalSlide18.hide(); myVerticalSlide18.addEvent('complete', function() { $('vertical_status18').set('html', status[myVerticalSlide18.open]); }); });
Ligne dans la table:
JS script:
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 <div class="marginbottom"> Name and description of Item 6 <div id="vertical_slide.[i]"><br /> <table border="0" align="center" cellspacing="0"> <tr><td colspan="2" class="p">Name : Item 6</td></tr> <tr><td colspan="2" class="p">Type : Documentation</td></tr> <tr><td colspan="2" class="p">Description : Full Tutorial 6</td></tr> <tr><td class="p">Document 6</td> <td class="p">Tutorial 6</td></tr> <tr><td class="p">Illustration 6</td> <td class="p">Album 6</td></tr> <tr><td class="p">Example 6.1</td> <td class="p">Example 6.2</td> </tr><tr><td class="p">Example 6.3</td> <td class="p"> </td></tr></table><br /> <div align="right">- Close</div></div></div>
J'espère que mon explication est suffisement claire J'ai fait de nombreuses tentatives par moi-même mais sans succès. J'espère sincèrement pouvoir trouver quelqu'un en mesure de m'aider car l'administartion sans ce système serait vraiment lourde et fastidieuse.
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 window.addEvent('domready', function() { var status = {'true': 'open','false': 'close'}; var i=0; for i=0;i<=18;i++; { var myVerticalSlide[i] = new Fx.Slide('vertical_slide'.[i] ); $('v_slidein'.[i] ).addEvent('click', function(e){ e.stop();myVerticalSlide.[i].slideIn();}); $('v_slideout'.[i] ).addEvent('click', function(e){ e.stop();myVerticalSlide.[i].slideOut();}); $('v_toggle'.[i] ).addEvent('click', function(e){ e.stop();myVerticalSlide.[i].toggle();}); $('v_hide'.[i]).addEvent('click', function(e){ e.stop();myVerticalSlide.[i].hide(); $('vertical_status'.[i]).set('html', status[myVerticalSlide.[i].open]);}); $('v_show'.[i]).addEvent('click', function(e){ e.stop();myVerticalSlide.[i].show(); $('vertical_status'.[i]).set('html', status[myVerticalSlide.[i].open]);}); myVerticalSlide.[i].hide(); myVerticalSlide.[i].addEvent('complete', function() { $('vertical_status'.[i]).set('html', status[myVerticalSlide.[i].open]); }); i++; } });
J'utilise Mootools 1.2 dans une plateforme CMS.
Merci d'avance pour votre aide.
Polo
Partager