Ajax to load CListView

Hey,

New yii user here, so thanks for helping. I’m trying to load some remote data into a clistview. It works fine, but as the remote data (flickr images) can take a while the whole page waits for it to load. I thought I would try placing the list in a different view, and then do a CHtml::ajax call to load the view.

Basically, like this:

In Controller:


function actionAjaxFlickr($tag)

{

... (get flickr images into an array to create a carraydataprovider)

.....

		$images = getFlickrImages($title);

		.....


		$dataProvider=new CArrayDataProvider($images, array(

			'id'=>'flickr',

			'pagination'=>array(

				'pageSize'=>$pageSize,

			),			

		));


		echo $this->renderPartial('_ajaxFlickr',array('dataProvider' => $dataProvider));

}



In the _ajaxFlickr view:




<?php

$this->widget('zii.widgets.CListView', array(

'dataProvider'=>$dataProvider,

'itemView'=>'_flickr',

'ajaxUpdate'=>'FlickrGallery',

'pager' => array(

'header' => '',

),  

));


?>



In the view the user sees (display):




<?php

 Yii::app()->clientScript->registerScript(

  "test",

  "jQuery.ajax({

  type: 'POST',

  url: '".CController::createUrl('controller/ajaxFlickr' . $tag)."',

  success: function(html){

   jQuery('#FlickrGallery').html(html);

   }

  });",

  CClientScript::POS_READY

);

?>

<div id='FlickrGallery'>

</div>



When I tried it the first page of images load as expected, but the pagination links aren’t styled and they point to ajaxflickr/tag?page=whatever. If I click the links they open ajaxFlickr as a new page and show the new images. I tried messing with the pagination routes but can’t find something that will make this work. So either I’m missing something, or I’m doing this the wrong way. Any ideas?

  • Tom

Hi,

I know it’s been quite some time since you posted this, but did you actually figure it out?

I have the same problem. The first page displays fine, but all the subsequent are loading in a new page. I think the necessary javascript is not loaded somehow.

Thanks…

Check this out:

http://24ways.org/2010/speed-up-your-site-with-delayed-content

Excuse me,

How does that help in regards to the original problem? I fail to see any connections…

I fail to see why you can fail to see that it’s related …

The original problem is that the Flickr images takes too long to load.

If you use delayed loading the problem is gone, isn’t it?

Now I see why you failed to see why I failed to see where the connection was… :)

My problem is not on the delayed loading of Flickr images, but on the fact that I cannot get my CListView (that I load through a renderPartial) to update through AJAX, after the second click. It seems that the pager buttons, instead of reloading inplace, they load a whole new page (without my layout).

From the forums and other post I read that it has to do with double loaded Clientscripts but I fail to see where the problem is exactly… :(

Oops, yes I get it now.

Unfortunately, I haven’t got a solution… :(

Let’s try again:

http://www.yiiframework.com/forum/index.php?/topic/10021-cjuidialog-and-ajaxsubmitbutton/

Hey Jacmoe,

Thanks for your insistence on helping out… :)

Unfortunately I have tried it your latest hint but it doesn’t seem to work in my case.

I ended up merging my two controller actions (the one drawing the view page and the one that was returning the ajax response) into one action (by checking if the request isAjaxRequest) and it seems to work now.

I’m still investigating the issue though!

I am facing the same problem. I have used only 1 controller to fetch content, still the new content is displayed on new page. can you help me to work this out?