Temat: jquery

witam,

mam taka zagwostke. w jaki sposob odkryc (display:block;) podkategorie w moim sklepie internetowym..
oto kod:

<div id="kategorie">

<ul class="categories"> <!--TUTAJ KATEGORIE-->

	<li >

	<a class="main_name" href="#"  title="">Do dekoracji</a>

	<ul class="podkategorie"> <!--TUTAJ PODKATEGORIE-->

		<li class="dupa">

			<a href="#">Zwierzęta</a>

		</li>

		<li class="dupa">

			<a href="#">Figurki</a>

		</li>

		<li class="dupa">

			<a href="#">cos tam</a>

		</li>

		<li class="dupa">

			<a href="#">cos tam 2</a>

		</li>

		<li class="dupa">

			<a href="#">cos tam 3</a>

		</li>

	</ul>

		 <a class="more" href="" TITLE="Pokaż więcej podkategorii">Więcej</a>

</li>

<li>

<a class="main_name" href="#"  title="">Do dekoracji</a>

	<ul class="podkategorie">

		<li class="dupa">

			<a href="#">cos tam</a>

		</li>

	</ul>

</li>

</ul>

</div>

w ccs klasa ma atrybut display: none

w jquery cos takiego:
$("#kategorie").find('li.dupa:lt(3)').css('display','block');

dziala, ale poniewaz kazdy li, jestem elementem klasy dupa, to wyswietla mi tylko 3 pierwsze podkategorie ze wszystkick kategorii.
W jaki sposob skonstruowac ten skrypt, aby dzialal tylko na 3 pierwszych li z kazdej kategorii osobno.

z gory dzieki za pomoc

Temat: jquery

niech każda kategoria ma swoje ID i wtedy jedziesz po tym ID w selektorze

Temat: jquery

Nie wiem czy o to chodziło bo niesamowicie chaotyczny opis. Specjalnie się nie wczytywałem wolałem po prostu to zrobić tymbardziej że to była chwila. Więc tak:

- usun display none z css niech jquery ukrywa podkategorie

$('ul.categories li ul').hide();

- dodaj # w a.more

Po kliknięciu w a.more pokazuje się lista podakategorii która była w tym samym li co przycisk more (i chowają sie wszystkie inne).

$('.more').click(function() { 

		$('ul.categories li ul').hide();

		$(this).parents('li').children('ul.podkategorie').show();

	});

Całość kodu na dole

<div id="kategorie">

	<ul class="categories">

		<li>

			<a class="main_name" href="#"  title="">Do dekoracji</a>

			<ul class="podkategorie">

				<li class="dupa"><a href="#">Zwierzęta</a></li>

				<li class="dupa"><a href="#">Figurki</a></li>

				<li class="dupa"><a href="#">cos tam</a></li>

				<li class="dupa"><a href="#">cos tam 2</a></li>

				<li class="dupa"><a href="#">cos tam 3</a></li>

			</ul>

			<a class="more" href="#" TITLE="Pokaż więcej podkategorii">Więcej</a>

		</li>

		<li>

			<a class="main_name" href="#"  title="">Do dekoracji</a>

			<ul class="podkategorie">

				<li class="dupa"><a href="#">Zwierzęta</a></li>

				<li class="dupa"><a href="#">Figurki</a></li>

				<li class="dupa"><a href="#">cos tam</a></li>

				<li class="dupa"><a href="#">cos tam 2</a></li>

				<li class="dupa"><a href="#">cos tam 3</a></li>

			</ul>

			<a class="more" href="#" TITLE="Pokaż więcej podkategorii">Więcej</a>

		</li>

		<li>

			<a class="main_name" href="#"  title="">Do dekoracji</a>

			<ul class="podkategorie">

				<li class="dupa"><a href="#">Zwierzęta</a></li>

				<li class="dupa"><a href="#">Figurki</a></li>

				<li class="dupa"><a href="#">cos tam</a></li>

				<li class="dupa"><a href="#">cos tam 2</a></li>

				<li class="dupa"><a href="#">cos tam 3</a></li>

			</ul>

			<a class="more" href="#" TITLE="Pokaż więcej podkategorii">Więcej</a>

		</li>

	</ul>

</div>





<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){



	$('ul.categories li ul').hide();

	$('.more').click(function() { 

		$('ul.categories li ul').hide();

		$(this).parents('li').children('ul.podkategorie').show();

	});

});

</script>

Robert S. edytował(a) ten post dnia 09.07.10 o godzinie 16:21

Temat: jquery

Piotr Misiurek:
niech każda kategoria ma swoje ID i wtedy jedziesz po tym ID w selektorze

a w jaki sposob w smartach wrzucic jakis indeks w id?
w pliku .tpl, gdzie generowany jest widok z kategoriami, wyglada to tak:

{if $node.children|@count > 0}

		<ul>

		{foreach from=$node.children item=child name=categoryTreeBranch}

			{if $smarty.foreach.categoryTreeBranch.last}

						{include file=$tpl_dir./category-tree-branch.tpl node=$child last='true'}

			{else}

						{include file=$tpl_dir./category-tree-branch.tpl node=$child last='false'}

			{/if}

		{/foreach}

		</ul>

Temat: jquery

Rozumiem że masz tablicę linków "kategorii" z tzw "parentami"?

1.Robisz ULe i LI które przehcowują nowe ULe
2. Ukrytym ULom dajesz np ID z numerem kategorii a dla LI onclick zdarzenie z przekazanym odpowiednim ID i w jquery pokazujesz je.
3.Dajesz CLASS ogólną jedną żeby po klasie w jquery w każdym kliknięciu schować wszystko.