Cmenu Url With Ajaxlink ?

Yii 1.1 General Discussion
1

Hi,

Is it possible to configure CMenu url to be an ajaxLink ?

Thanks

2

Why not, give onclick action to CMenu items. so in js function do what you want here is the rough method:




function onclickAction(e){

   //do ajax here.

   e.preventDefault();

   return false;

}

So it prevents to behave exactly like link. So it will not jump to new page.

3

I created a function to generate the OptionMenu ajax, however I am using Yii Bootstrap, but the concept should be the same. When you get home put here for you to see.

4

Sorry for the delay.

Much work lately.

I created a View Helper…

HView.php in protected/models/helpers


<?php


class HView

{


    private static function _getData($view, $controller = null)

    {

	$data = array('name' => $view);


	if (!empty($controller)) {

	    $data['controller'] = $controller;

	}


	return $data;

    }


    public static function getAjaxMenuArrayConfig($view, $controller = null)

    {

	return array(

	    'url' => array('ajax/loadView'),

	    'type' => 'POST',

	    'dataType' => 'html',

	    'data' => HView::_getData($view, $controller),

	    'cache' => false,

	    'beforeSend' => "function() {

		if($('#{$view}MenuOption').hasClass('active')) { return false; }

		

		$('#menu').children('ul').children('li.active').removeClass('active');

		$('#{$view}MenuOption').addClass('active').children('a');

		

		// Show the loader in content here

	    }",

	    'success' => "function(response) {

		// You success action. Sample...

		$('#content').html(response).fadeIn('low');

	    }",

	    'error' => "function(error) {

		// You error action

	    }",

	);

    }

}

You CMenu…




<?php


$this->widget('bootstrap.widgets.TbMenu', array(

    'type' => 'tabs',

    'stacked' => false,

    'items' => array(

	array(

	    'label' => Yii::t('app', 'Home'), 'icon' => 'icon-home', 'url' => '#', 'itemOptions' => array('id' => 'indexMenuOption', 'class' => 'firstTopItem active'),

	    'linkOptions' => array('ajax' => HView::getAjaxMenuArrayConfig('index', 'site'))),

	array(

	    'label' => Yii::t('app', 'Services'), 'icon' => 'icon-book', 'url' => '#', 'itemOptions' => array('id' => 'servicesMenuOption'),

	    'linkOptions' => array('ajax' => HView::getAjaxMenuArrayConfig('services'))),

    ),

));

I’m using Yii Bootstrap, but the concept is the same.

5

Thanx man!

UPDATE:

Just tried your code but had big problems with ‘beforesend’ JS part (as I’m not good in JS):




'beforeSend' => "function() {

                if($('#{$view}MenuOption').hasClass('active')) { return false; }

                

                $('#menu').children('ul').children('li.active').removeClass('active');

                $('#{$view}MenuOption').addClass('active').children('a');

                

                // Show the loader in content here

            }",

it seems like all of your menu items have the same selector id (’#{$view}MenuOption’). So if some item is clicked - all menu items become “active”. I’ve found out that in “pure” JS I could use




        $(this).addClass('active').children('a');

but it doesn’t work here… :(

so I had to attach to each item unique selector id and add\remove "active" class to that particular id:




      $('#menui_{$param}').addClass('active').children('a');

That’s working just as I expect and I just wanted to share solution for someone like me :)

BUT can it be done in more "proper" way?