Forum PHP.pl

mam taką tabelke:

[HTML] pobierz, plaintext 
<table>
<thead>
<tr><th>tytul</th></tr>
</thead>
<tbody>
<tr>
<td>text</td>
<td>text</td>
<td>text</td>
</tr>
</tbody>
<thead>
<tr><th>tytul2</th></tr>
</thead>
<tbody>
<tr>
<td>text2</td>
<td>text2</td>
<td>text2</td>
</tr>
</tbody>
</table>
[HTML] pobierz, plaintext 

i teraz chciałbym zapytać jak zrobić ze id thead i tbody jest równe, tzn. mam pierwsze thead które ma id 1 tbody które ma również id 1 kolejne thead ma id 2 i tbody kolejne ma id 2 itd. ponieważ korzystam z skryptu (http://mediaformations.com/accordion-tables-with-jquery/) ukrywającego wiersze ukrywa mi wszystkie wiersze które mam mam w tbody a ja chce tylko jedna grupę. no i jeszcze jedno jak domyślnie zrobić aby były te wiersze zwinięte, tzn po załadowaniu pokazuje tylko nagłówki.

Ten post edytował piotrooo89 10.11.2009, 10:08:13

Hej

Wydaje mi się, iż błedem jest definiowanie w ramach jednej tabeli kilku sekcji <thead>. Zgodnie z dokumentacją w tabeli może być 1 lub wiele elementów <tbody>, ale nie ma mowy o sekcjach <thead> i <tfoot>. Według mnie w jednej tabeli może być tylko jeden <thead> i jeden <tfoot>...

wiedziałem ze ktoś z czymś takim wyjedzie kurcze zadałem oczywisty problem, nie zapytałem czy to co napisałem jest zgodne ze standardami tylko jak zrobić ukrywanie. @fly474 zaznajomiony jestem z tymi rzeczami, jednak mam tutaj zupełnie iny problem

Nie możesz mieć w dokumencie dwóch elementów o tym samym id. Jak już to lepiej powrzucać tabel w divy i tak robić accordion. Druga opcja to użycie klas.

Mi się widzi, że lepiej byłoby to samemu w JS napisać i w zdarzeniu onclick dla thead, zmieniać display tbody odpowiedniego. Problemem pewnym może być wybranie elementu do ukrycia. Zrezygnowałbym więc z nadawania id sekcji thead tabel i zostawiłbym ją jedynie dla tbody. Domyślnie wtedy mógłbym stronę uruchamiać z display wyłączonym we wszystkich tbody i dopiero kliknięcie na odpowiednim thead wyświetliło by mi odpowiedni. A napisanie funkcji w stylu displaying(tbodyId) zmieniającą style dla nich to dla Ciebie zapewne prościzna. Myślę, że w większości przypadków najprostsze rozwiązania są najlepsze.

EDIT: bym zapomniał, o użyciu JQuery by efekt animacji był

Ten post edytował thek 10.11.2009, 10:43:35

może macie racje ze lepiej to zrobić w czystym JS. ale jako że jestem człowiekiem dociekliwym będę pytał dalej,

jeśli na sztywno wpisze id:

[HTML] pobierz, plaintext 
$(this) .parents('table.list') .children('tbody#0') .toggle();
[HTML] pobierz, plaintext 

to chowa się tylko jedna grupa czyli tak jak ma być.

jak teraz przypisać id klikniętego th?

[HTML] pobierz, plaintext 
 $(document).ready(function(){
 
                $('table.list th') .click(
                function() {
                    $(this) .parents('table.list') .children('tbody#'+$(this).attr('id')) .toggle();
                }
                )
        });
[HTML] pobierz, plaintext 

robię to tak no i nie bardzo chce zadziałać. co jest nie tak?

ok już mam znalazłem błąd... dopisywałem to do thead a nie do th...

Ten post edytował piotrooo89 10.11.2009, 10:51:58

pewnie lepiej byloby podazac wskazowkami wookieb ale jesli bedziesz sie parentowal do do <thead /> zamiast <table /> i uzyjesz next() to tez powinno dzialac

//update
ups - dopiero teraz zaowazylem update piotrooo89

Ten post edytował seth-kk 10.11.2009, 12:41:37

Możesz całkiem wywalić te identyfikatory, nawet tak będzie lepiej.

W jQuery jest funkcja/selektor eq(), to jej potrzebujesz.

A jeśli potrzebujesz konkretnego offsetu dynamicznie - index() i zwraca ona numer względem kolekcji zapisanej wcześniej w wybranej zmiennej.

mam teraz taki problem, chciałbym aby ta tabela była odporna na odświeżania, tzn rozwinąłem np 2 grupy i kliknąłem na link co zrobić aby mi się ona nie chowała?

tabelka wygląda tak:

[HTML] pobierz, plaintext 
<table>
 
<thead><tr><th style="cursor:pointer" id="1" colspan="2">Grupa 1</th></tr></thead>
<tbody style="display: none;" id="1"><tr><td width="80%">Do gr 1</td><td><a href="?id_user=1">nadaj</a></td></tr></tbody>
<tbody style="display: none;" id="1"><tr><td width="80%">Do gr 1</td><td><a href="?id_user=2">nadaj</a></td></tr></tbody>
 
<thead><tr><th style="cursor:pointer" id="2" colspan="2">Grupa 2</th></tr></thead>
<tbody style="display: none;" id="2"><tr><td width="80%">Do gr 2</td><td><a href="?id_user=3">nadaj</a></td></tr></tbody>
<tbody style="display: none;" id="2"><tr><td width="80%">Do gr 2</td><td><a href="?id_user=4">nadaj</a></td></tr></tbody>
 
</table>
[HTML] pobierz, plaintext 

i teraz jak kliknę nadaj i mam rozwinięte obie grupy to nieche aby one się chowały. chciałbym uniknąć korzystania a AJAX'a.

Może $_Session lub $Cookies

Ten post edytował fly474 13.11.2009, 12:00:01

a jakieś jeszcze pomysły?

deep linking lub rozwijac w php na podstawie URLa
btw dlaczego oddzielne <tbody /> dla kazdego <tr />?
btw2 id powinno zaczynac sie od litery
skoro id 'musza' sie powtarzac to dlaczego nie zastapisz ich klasami?