| Autor | Zpráva | ||
|---|---|---|---|
| had Profil * |
#1 · Zasláno: 14. 4. 2013, 21:35:43
Ahoj,
snažím se udělat takovou jednoduchoučkou aplikaci, která bude načítat a filtrovat poznámky ze čteček Kindle. Nahraju na server z Kindlu txt soubor, načtu z něho data do HTML, vytvořím menu, ve kterém budou zaškrtávací políčka, kterými se budou filtrovat položky. Jednotlivé položky mají následující vlastnosti: 1) typ - každá položka je buď POZNÁMKA nebo OZNAČENÍ. Více možností typu než tyto dvě nebude. 2) název knihy - každá položka má jeden název knihy. V menu může existovat vícero checkboxů podle počtu druhů knih. Mám třeba 60 poznámek a označení z 10 knih => zde bude 10 filtrovacích checkboxů. 3) autor - každá položka má jednoho svého autora. Stejný případ jako u knih - zobrazím v menu tolik checkboxů, kolik bude druhů autorů, každý bude mít checkbox. Co chci je jednoduché. Na začátku jsou všechny checkboxy v menu zaškrtnuté a zobrazené všechny položky. Odškrtnu / zaškrtnu libovolný checkbox a skryjí / zobrazí se mi položky, které mají daný atribut. Pokud by se jednalo o jeden checkbox, bylo by to v pohodě, ale vícenásobné skrývání / zobrazování proměnlivého počtu filtrovacích možností už je docela oříšek... Napadá někoho, prosím, způsob, jak na to? |
||
| Jan Tvrdík Profil |
had:
„Napadá někoho, prosím, způsob, jak na to?“ Pokud neřešíš výkon, tak stačí mít pole s DOMElementů (pro každou poznámku) a při každé změně nějaké checkboxu to pole proiterovat a pro každou poznámku rozhodnout, zda se má zobrazit nebo ne. Další možné řešení může být přes soubor CSS tříd. Jednotlivé poznámky na sobě budou mít např. CSS třídy kniha_42 autor_16 typ_1 a každý checkbox bude vázán na jednu třídu.
|
||
| had Profil * |
#3 · Zasláno: 14. 4. 2013, 21:51:32 · Upravil/a: had
hm...bohužel tohle řešení jsem nepochopil, jsem asi úplně natvrdlej :-) Co by přesně mělo být v tom poli? Všechny možnosti a T/F k nim?
k CSS třídám: to by znamenalo, že bych musel generovat X * Y možností CSS stylů? Tedy všechny varianty CSS stylů? |
||
| Jan Tvrdík Profil |
#4 · Zasláno: 14. 4. 2013, 21:54:46
had:
„Co by přesně mělo být v tom poli?“ Něco jako document.getElementsByClassName('note').
„to by znamenalo, že bych musel generovat X * Y možností CSS stylů? Tedy všechny varianty CSS stylů?“ Stejně stylů jako checkboxů. |
||
| had Profil * |
#5 · Zasláno: 14. 4. 2013, 22:04:31
1) Pole: aha, pochopil jsem (snad) :) Ale je to docela šílené řešení...
2) CSS: to ale už i teď musí každá položka mít třídu, abych je mohl vůbec ovládat. Potřebuju přece změnu u všech položek stejného typu... ale to stejně nemůže fungovat, musel bych jim přeřazovat pořadí, aby se mi přepisovala vlastnost display: none;, nebo ne?
|
||
| juriad Profil |
Raději bych to řešil přes třídy.
Každé položce přidáš tři třídy: ... <div class="hniha_42 autor_16 typ_1">Toto je poznamka autora 16 u knihy 42</div> ... a na každý checkbox navěsíš něco takového: $("#kniha_42").change(function() { // checkbox ma id kniha_42
if(this.checked) {
$('.kniha_42').removeClass('not_kniha_42'); // polozky maji class kniha_42
} else {
$('.kniha_42').addClass('not_kniha_42');
}
});.not_kniha_42, .not_autor_16, ... {
display: none;
}každý checkbox si bude obsluhovat jen svou sadu tříď (kniha_42 a not_kniha_42); samotný mechanismus css se postará o to, že položka bude zobrazena jen tehdy, když nebude mít žádné třídy not_* |
||
| had Profil * |
#7 · Zasláno: 14. 4. 2013, 22:11:15
juriad: ale to mi nebude fungovat úplně korektně - CSS bude hodnotu vlastnosti přepisovat, bude se brát v potaz poslední možnost - tedy zobrazit (podle .typ_1)
<div class="kniha_42 not_autor_16 typ_1">obsah poznámky</div> |
||
| juriad Profil |
#8 · Zasláno: 14. 4. 2013, 22:15:39
<div class="kniha_42 autor_16 typ_1">obsah poznámky</div> Ty budeš jen manipulovat pouze s třídami not_*. Třídy kniha_*, autor_*, typ_* zůstávají přiřazené v atributu class v HTML. |
||
| had Profil * |
#9 · Zasláno: 14. 4. 2013, 22:20:15
ha! Ok, zkusím to tak a kdyby to nešlo, tak se zítra znovu ozvu.
(Zatím) díky za pomoc s řešením a hezký večer! |
||
|
Časová prodleva: 13 let
|
|||
0