Image Link Using Ajax

Hi guys lets say i have images thumnail if i click that i prefer to show it bellow using ajax…any idea?

Hi you need to do 3 things:

1- in your view, register a click event handler to catch the clicking on the thumbnail image and then trigger the ajax request

2- in your controller, find the address of the actual image in the database and return it as an ajax response

3- again in your view, take this response and add/append/prepend/… it to a html element ( e.g. a simple <div> )

1 & 3 (view):




<?php Yii::app()->getClientScript()->registerScript('loadOriginalImageByAjax', '

	jQuery(function(){

    	$(".ajax-thumb").on("click", function(event){

        	event.preventDefault();

        	$.ajax({

       			type: "GET",

       			data: "imageid"+$(this).data("image-id"),

       			url: "'.Yii::app()->createUrl('myController/myAction').'",

        	}).done(function(html){

           		$("#image_container").html("");

               	$("#image_container").html(html);

        	}).fail(function(){

               	alert("error!");

        	});

    	});

	})

	', CClientScript::POS_END);

?>


<a href="#" class="ajax-thumb" data-image-id="1"><img src="example.com/thumb.jpg"/></a>

<div id="image_container"></div>

2 (controller):


public function actionMyAction($imageid){	

	$model=Image::model()->findByPk($imageid);

	

	echo '<img src="'.$model->address.'" />'; // or $this->renderPartial(image_view', $model);

}