Cześć!
Borykam się z problemem związanym z JavaScriptem - a raczej z brakiem szerszej wiedzy w tym zakresie.
Robię na Wordpressie stronę, która będzie miała dużo kategorii, subkategorii i subsubkategorii.
Aby to wszystko filtrować ściągnąłem wtyczkę Filter & Search, gdzie można za pomocą checkbox'ow wybierać kategorie wpisów.
Wszystkie kategorie i ich subkategorie są domyślnie rozwinięte co zajmuje dużo miejsca na stronie.
Potrzebuję JavaScriptu który to wszystko schowa, i zostawi tylko główne kategorie, a resztę pokaże po kliknięciu.
W HTMLu wygląda to tak:
<aside id="sidebar" class="sidebar">
<div class="sidebar-content">
<section id="text-3" class="widget widget_text">
<div class="widget-title">Przykład nr 2</div>
<div class="textwidget">
<form data-sf-form-id="1006205" data-is-rtl="0" data-maintain-state="" data-results-url="https://ducatus.org/" data-ajax-url="https://ducatus.org/?sf_data=results" data-ajax-form-url="https://ducatus.org/?sfid=1006205&sf_action=get_data&sf_data=form" data-display-result-method="post_type_archive" data-use-history-api="1" data-template-loaded="0" data-taxonomy-archives="1" data-lang-code="" data-ajax="1" data-ajax-data-type="html" data-ajax-target="#main" data-ajax-pagination-type="infinite_scroll" data-show-scroll-loader="1" data-infinite-scroll-trigger="-100" data-ajax-links-selector=".pagination a" data-update-ajax-url="1" data-only-results-ajax="1" data-scroll-to-pos="0" data-init-paged="1" data-auto-update="1" action="https://ducatus.org/" method="post" class="searchandfilter" id="search-filter-form-1006205" autocomplete="off" data-instance-count="1">
<ul>
<li class="sf-field-category" data-sf-field-name="_sft_category" data-sf-field-type="category" data-sf-field-input-type="checkbox" data-sf-term-rewrite="["https:\/\/ducatus.org\/category\/[0]\/","https:\/\/ducatus.org\/category\/[0]\/[1]\/","https:\/\/ducatus.org\/category\/[0]\/[1]\/[2]\/","https:\/\/ducatus.org\/category\/[0]\/[1]\/[2]\/[3]\/"]">
<ul id="MainMenu" data-operator="and" class="">
<li class="sf-level-0 sf-item-1" data-sf-count="0" data-sf-depth="0"><input class="sf-input-checkbox" type="checkbox" value="bez-kategorii" name="_sft_category[]" id="sf-input-34a414f743dd370f2e1f1938d6493244"><label class="sf-label-checkbox" for="sf-input-34a414f743dd370f2e1f1938d6493244">Bez kategorii</label></li>
<li class="sf-level-0 sf-item-47" data-sf-count="1" data-sf-depth="0"><input class="sf-input-checkbox" type="checkbox" value="timeline" name="_sft_category[]" id="sf-input-7aba07c8d1fbb2346833e4ca738ccf52"><label class="sf-label-checkbox" for="sf-input-7aba07c8d1fbb2346833e4ca738ccf52">Timeline</label>
<ul class="children">
<li class="sf-level-1 sf-item-48" data-sf-count="3" data-sf-depth="1"><input class="sf-input-checkbox" type="checkbox" value="prehistory-and-antique" name="_sft_category[]" id="sf-input-84fc4badfee71fdd0a249930c75e60f6"><label class="sf-label-checkbox" for="sf-input-84fc4badfee71fdd0a249930c75e60f6">Prehistory and antique</label>
<ul class="children">
<li class="sf-level-2 sf-item-49" data-sf-count="2" data-sf-depth="2"><input class="sf-input-checkbox" type="checkbox" value="prehistory" name="_sft_category[]" id="sf-input-ff5ee06faa29bb2ae69f766371bbaa93"><label class="sf-label-checkbox" for="sf-input-ff5ee06faa29bb2ae69f766371bbaa93">Prehistory</label></li>
<li class="sf-level-2 sf-item-50" data-sf-count="1" data-sf-depth="2"><input class="sf-input-checkbox" type="checkbox" value="bronze-age" name="_sft_category[]" id="sf-input-1760d2e76ed15d69194d585bb06f8f4e"><label class="sf-label-checkbox" for="sf-input-1760d2e76ed15d69194d585bb06f8f4e">Bronze age</label></li>
</ul>
</ul>
</li>
</ul>
</li>
</ul>
</form>
</div>
</section>
</div>
</aside>
Timeline to kategoria główna, Prehistory and antique to podkategoria Timeline, a Prehistory to podkategoria Prehistory and antique. A więc tak:
- Timeline
1.1. Prehistory and antique
1.1.1.Prehistory
1.1.2. Bronze Age
Potrzebuję to wszystko schować, do głównej kategorii Timeline.
Zrobiłem coś takiego
$('#MainMenu').find('> li').click(function() {
$('#MainMenu > li').not(this).find('ul').slideUp();
$(this).find('ul').stop(true, true).slideToggle(400);
return false;
});
Ale niestety jak kliknę w Bronze Age to chowa mi wszystko
Ktoś ma jakieś rozwiązanie? Będę wdzięczny a nawet zapłacę!
Dzięki!
/////////////
Dodałem w Javie, a powinno być w JavaScript. Jak można przenieść to będę wdzięczny