Lost with AjaxLink produced by AjaxLink

Hi all,

When I click on an ajaxlink produced by clicking an ajaxLink, the second ajaxlink points to the same /module/controller/action with that of the first ajaxlink.

Here’s my view




<div class="tree-menu" id="trunk">

	<ul id="sortable">

	<?php

		foreach($main as $key=>$value){

			echo '<li class="ui-state-default">';

			echo CHtml::ajaxLink($value['title'],array('/backOffice/sideMenu/manageHeaders','id'=>$value['id']),array('update'=>'#branch'));

			echo '</li>';

		}    

	?>

	</ul>

</div>

<div class="tree-menu" id="branch"></div>

<div class="tree-menu" id="leaf"></div>



Controller:




public function actionManageHeaders($id){

		$headers = $this->queryHeaders($id);

		$return = '<ul id="sortable">';

		foreach($headers as $key=>$value){

			$return .='<li class="ui-state-default">';

			$return .= CHtml::ajaxLink($value['text'].'ghdfghds',array('/backOffice/sideMenu/manageChildren','id'=>$value['id']),array('update'=>'#leaf'));

			$return .= '</li>';            

        } 

		$return .= '</ul>';

		echo $return;

	}

	

	public function actionManageChildren($id){

		$headers = $this->getQueryChildren($id);

		$return = '<ul id="sortable">';

		foreach($headers as $key=>$value){

			$return .='<li class="ui-state-default">';

			$return .= CHtml::ajaxLink($value['title'],array('/backOffice/sideMenu/manageChildren'),array('update'=>'#'));

			$return .= '</li>';            

        } 

		$return .= '</ul>';

		echo $return;

	}



As you can see, what I want when I click a list in #trunk, I want #branch to be updated. And when I click on an item in #branch, I want #leaf to be updated.

What happens is that when I click on an item in #trunk, it calls the actionManageHeaders alright. But when I click on an item in #branch, it still refers me to actionManageHeaders when I expect it to be linked to actionManageChildren.

Any idea where did I go wrong?

When you call CHtml::ajaxLink in your first method it registers some javascript to handle the ajax call on the new link, but since this content is going thorught ajax this javascript does not get executed, and the when the new links are added they get binded with the old javascript event, (maybe through live)

HI Asgaroth,

Thanks for the info.

I’m not quite knowledgeable when it comes to jQuery. Could you give me some advice on how should I proceed, given that the new javascript for ajaxlinks are impossible to be passed when called by an ajaxlink?

Im not good adviser in this case, since I love jQuery and love to generate my own code, so I never use ajaxLink or stuff like that unless its very very basic functionality, because Im generally creating widgets and the like.