CMenu - klasa CSS

Witam,

Mam mały problem z komponowaniem menu w Yii za pomocą CMenu. Mam taki kod:




        public $menuLeft = array(

                        'activeCssClass' => 'active',                        

                        'items'=>array(

                            array('label'=>"Dział pierwszy", 'items'=>array(

                                    array('label'=>'Poddział 1_1', 'url'=>array('/dzial11/')),

                                    array('label'=>'Poddział 1_2', 'url'=>array('/dzial12/')),

                                ),

                            ),

                            array('label'=>"Dział 2", 'items'=>array(

                                    array('label'=>'Poddział 2_1', 'url'=>array('/dzial21/')),                                    

                                ),

                            ),

                            array('label'=>"Dział 3", 'items'=>array(

                                    array('label'=>'Poddział 3_1', 'url'=>array('/dzial31/')),                                    

                                ),

                            ),                             

                        )

        );



Tablica ta po podaniu jako parametr do widget’a CMenu generuje mi taki kod HTML:




<ul id="yw0">

	<li>

		<span>Dzial 1</span>

		<ul>

			<li><a href="/dzial11/">Poddzial 1_1</a></li>

			<li><a href="/dzial12/">Poddzial 1_2</a></li>

		</ul>

	</li>

	<li>

		<span>Dzial 2</span>

		<ul>

			<li><a href="/dzial21/">Poddzial 2_1</a></li>

		</ul>

	</li>

	<li>

		<span>Dzial 3</span>

		<ul>

			<li><a href="/dzial31/">Poddzial 3_1</a></li>

		</ul>

	</li>

</ul>

Mój problem jest taki, że nie potrafię dodać klasy do konkretnego elementu tej listy. Wiem jak dodać klasę dla elementu <a> ale już dla konkretnego elementu <li>, <ul> lub <span> nie potrafię tego zrobić.

Ogólnie rzecz ujmując chciałbym nadać elementowi <span>Dział 2</span> klase "specjalny", tak żeby kod wyglądał <span class="specjalny">Dział 2</span>.

Przeglądałem tą stronę podczas tworzenia menu http://www.yiiframework.com/doc/api/1.1/CMenu ale mimo wszystko nie potrafię znaleźć tam rozwiązania. Prawdopodobnie robię coś źle tylko nie wiem co. Czy ktoś mógłby mi pomóc i powiedzieć co powinien dodać do tablicy $menuLeft, aby dla tego konkretnego elementy dodać własną klasę CSS?

Z tego co widać w funkcji renderującej menu (http://code.google.com/p/yii/source/browse/tags/1.1.10/framework/zii/widgets/CMenu.php#181) te atrybuty pozwolą Ci ustawić odpowiednie klasy dla poszczególnych elementów.




<li> -> itemOptions

<span> lub <a> -> linkOptions

<ul> -> submenuHtmlOptions 



czyli:




        public $menuLeft = array(

                        'activeCssClass' => 'active',                        

                        'items'=>array(

                            array('label'=>"Dział pierwszy", 'items'=>array(

                                    array('label'=>'Poddział 1_1', 'url'=>array('/dzial11/')),

                                    array('label'=>'Poddział 1_2', 'url'=>array('/dzial12/')),

                                    'linkOptions'=>array('class'=>'KLASA_A'),

                                    'itemOptions'=>array('class'=>'KLASA_LI'),

                                ),

                            ),

                            array('label'=>"Dział 2", 'items'=>array(

                                    array('label'=>'Poddział 2_1', 'url'=>array('/dzial21/')),

                                   'linkOptions'=>array('class'=>'KLASA_A'),

                                  'itemOptions'=>array('class'=>'KLASA_LI'),                                    

                                ),

                            ),

                            array('label'=>"Dział 3", 'items'=>array(

                                    array('label'=>'Poddział 3_1', 'url'=>array('/dzial31/')),

                                   'linkOptions'=>array('class'=>'KLASA_A'),

                                  'itemOptions'=>array('class'=>'KLASA_LI'),                                    

                                ),

                            ),

                           'linkOptions'=>array('class'=>'KLASA_SPAN'),

                           'submenuOptions'=>array('class'=>'KLASA_UL_DLA_PODMENU'),

                        )

        );



Powinno działać, ale nie testowałem :slight_smile: Daj znać czy się udało.

Ok problem udało mi się rozwiązać, zrobienie czegoś takiego:




      public $menuLeft = array(

                        'activeCssClass' => 'active',                        

                        'items'=>array(

                            array('label'=>"Dział pierwszy", 'items'=>array(

                                    array('label'=>'Poddział 1_1', 'url'=>array('/dzial11/')),

                                    array('label'=>'Poddział 1_2', 'url'=>array('/dzial12/')),

                                ),

                            ),

                            array('label'=>"Dział 2", 'items'=>array(

                                    array('label'=>'Poddział 2_1', 'url'=>array('/dzial21/')),                                   

                                ),

                            ),

                            array('label'=>"Dział 3", 'items'=>array(

                                    array('label'=>'Poddział 3_1', 'url'=>array('/dzial31/')),                   

                                ),

                            ),

                           'linkOptions'=>array('class'=>'KLASA_SPAN'),

                        )

        );



Powodowało mi ze dodawało mi nowy element <span> na końcu listy. Podejrzewam ze kod ‘linkOptions’=>array(‘class’=>‘KLASA_SPAN’), traktowało jako składnik items. Problem udało mi się rozwiązać dodając ten element gdzie indziej, a mianowicie zrobiłem tak:




      public $menuLeft = array(

                        'activeCssClass' => 'active',                        

                        'items'=>array(

                            array('label'=>"Dział pierwszy", 'items'=>array(

                                    array('label'=>'Poddział 1_1', 'url'=>array('/dzial11/')),

                                    array('label'=>'Poddział 1_2', 'url'=>array('/dzial12/')),

                                ),

                            ),

                            array('label'=>"Dział 2", 'linkOptions'=>array('class'=>'KLASA_SPAN'), 'items'=>array(

                                    array('label'=>'Poddział 2_1', 'url'=>array('/dzial21/')),                                   

                                ),

                            ),

                            array('label'=>"Dział 3", 'items'=>array(

                                    array('label'=>'Poddział 3_1', 'url'=>array('/dzial31/')),                   

                                ),

                            ),                           

                        )

        );

Dzięki temu element <span> z zawartością Dział 2 dostał klasę CSS która chciałem.