ugrás a tartalomhoz

jQuery harmonika keszitese

zoliky · 2008. Jún. 10. (K), 17.42
Van egy HTML tablazat:
  1. <tr> <!-- container 1 begin -->  
  2.    <td class="container"><img class="show_hide" src="images/collapsed.gif" alt="[+]" /></td>  
  3. </tr> <!-- container 1 end -->  
  4. <tr>  
  5.    <td>forum1</td>  
  6.    <td>0</td>  
  7.    <td>0</td>  
  8.    <td>n/a</td>  
  9. </tr>  
  10. <tr>  
  11.    <td>forum2</td>  
  12.    <td>0</td>  
  13.    <td>0</td>  
  14.    <td>n/a</td>  
  15. </tr>  
  16. <tr> <!-- container 2 begin -->  
  17.    <td class="container"><img class="show_hide" src="images/collapsed.gif" alt="[+]" /></td>  
  18. </tr> <!-- container 2 end -->  
  19. <tr>  
  20.    <td>forum3</td>  
  21.    <td>0</td>  
  22.    <td>0</td>  
  23.    <td>n/a</td>  
  24. </tr>  
Kepen itt lathato: http://tinyurl.com/3osb99

A Javascript kodom a kovetkezot csinalja:

1. Egy esemenyt rendel a containerben talalhato IMG taghoz.
2. Ha raklikelek a container-ben levo kepre, a JS eltuntet minden tabla sort amely a klikelt container-hez tartozik.

Ime a kod:
  1. $(document).ready(function()  
  2. {  
  3.     $('.show_hide').click(function()  
  4.     {  
  5.         var containerFound = false;  
  6.           
  7.         $(this).parents('tr').nextAll().each(function()  
  8.         {  
  9.             $(this).children().children('.show_hide').each(function()  
  10.             {  
  11.                 containerFound = true;  
  12.             });  
  13.               
  14.             if (containerFound)  
  15.             {  
  16.                 return false;  
  17.             }  
  18.               
  19.             $(this).toggle();  
  20.         });  
  21.     });  
  22. });  
Online itt lehet kiprobalni a szkriptet: http://www.progra.ro (usernev: progy, jelszo: progydemo)
Szoval mukodik, minden szep es jo :) De sajnos szeretnek valamit megoldani:

1. Ha raklikelek a containerben levo kepre (vagy a szovegre), szeretnek egy parancsot lefutatni de csak akkor ha a fenti kodom mar becsukta a tablazat sorokat. Ugyanezt akarom forditva csinalni, masodik kliknel egy amikor a sorok kinyiltak lefutatni egy masik kodot.

Sajnos nem sikerul. Probaltam igy:
  1. $(document).ready(function()  
  2. {  
  3.     $('.show_hide').click(function()  
  4.     {  
  5.         var containerFound = false;  
  6.           
  7.         $(this).parents('tr').nextAll().each(function()  
  8.         {  
  9.             $(this).children().children('.show_hide').each(function()  
  10.             {  
  11.                 containerFound = true;  
  12.             });  
  13.               
  14.             if (containerFound)  
  15.             {  
  16.                 return false;  
  17.             }  
  18.               
  19.             $(this).toggle();  
  20.         });  
  21.     });  
  22.       
  23.     $('.show_hide').each(function()  
  24.     {  
  25.         $(this).toggle(function()  
  26.         {  
  27.           
  28.             if ($(this).is(':hidden'))  
  29.             {  
  30.                 $(this).attr("src", path + "/collapsed.gif");  
  31.             }  
  32.         }, function()  
  33.         {  
  34.             $(this).attr("src", "/progra/themes/progra/images/expanded.gif");  
  35.         });  
  36.     });  
  37. });  
Sajnos nem tudja nekem a kovetkezo sor if ($(this).is(':hidden')) leelenorizni, hogy a sorok be voltak csukva.

Valaki tudna segiteni par tanacsal ? Koszonom!
‹ Objektumon belül a this élérése eseményre innerHtml-lel img hozzáadás ›
 ■
1

Próba

Poetro · 2008. Jún. 10. (K), 23.51
  1. if ($(this).is(':hidden'))  
helyett
  1. if ($(this).parents('tr:first').is(':hidden'))  
Egyébként is minden
  1. $(this).parents('tr')  
-t lecserélnék
  1. $(this).parents('tr:first')  
-re, hogy csak a tényleges szülőjét csukja be, annak a szüleit sose.
2

ok

zoliky · 2008. Jún. 11. (Sze), 15.43
ez:
  1. if ($(this).parents('tr:first').is(':hidden'))   
nem teljesul.
Ha tudna valaki egy kis segitseget nyujtani nagyon orulnek !
3

Igy mukodik

zoliky · 2008. Jún. 11. (Sze), 19.32
  1. if ($(this).parents('tr').next().is(':hidden'))  
  2. {  
  3.     alert('ok');  
  4. }  
A logikam szerint ez csak az utana kovetkezo tabla sort elenorzi! Mondjuk elvileg igy is mukodne.
Akkor mondana csodot a kod ha az elso sor becsukodik a tobbi nem.
4

siblings?

Poetro · 2008. Jún. 11. (Sze), 20.19
siblings('tr') ?
5

ok

zoliky · 2008. Jún. 11. (Sze), 20.25
es akkor ujbol le kell elenoriznem ha a tabla sor eljut a masodik containerhez? Ha megfigyeled az elso HTML kodot amelyet bekuldtem akkor tudni fogod mirol beszelek !