Uploading File

How to upload multiple images in Tbactiveform?Please any one can share the working snippet.

In active form:

Mulitiple image with preview option:

Javascript:(for preview the image):

function handleFileSelect(evt) {

 var files = evt.target.files; // FileList object


 for (var i = 0, f; f = files[i]; i++) {


       if (!f.type.match('image.*')) {


         continue;


  }


  var reader = new FileReader();


  reader.onload = (function(theFile) {


          return function(e) {


               var span = document.createElement('span');


               var image =  theFile.name;


	  span.innerHTML = 


                    ["<span style='position:relative'><img  class='thumb' style='display:inline-block;' src="+e.target.result+" title="+escape(theFile.name)+"/></span>"].join('');


             document.getElementById('list').insertBefore(span, null);


    };


  })(f);


  reader.readAsDataURL(f);


}

}

document.getElementById(‘files’).addEventListener(‘change’, handleFileSelect, false);

view:(form)

<div style="">


	<?php


              	$this->widget('CMultiFileUpload', array('name'=>'picture[ ]',


												   'model'=>$model,


												  'accept'=>'jpg|gif|png|jpeg',


												   'options'=>array(),


												   'denied'=>'File is not allowed',


												  'id'=>'files',


												   'htmlOptions'=>array('multiple'=>'multiple'),





	));


    	?>

[size=2] </div>[/size]

&lt;div id=&quot;list&quot;&gt;&lt;/div&gt;

In controller:

public function actionCreate()

{


	&#036;model = new model;


	if(isset(&#036;_POST['UserGallery'])) //to check whether the usergallery variables present or not


	{


		&#036;model-&gt;attributes=&#036;_POST['UserGallery']; 


		&#036;images = CUploadedFile::getInstancesByName('uploaded_picture'); 


                    if (isset(&#036;images) &amp;&amp; count(&#036;images) &gt; 0) { 


                    foreach (&#036;images as &#036;image) { 


                   if (&#036;image-&gt;saveAs(Yii::app()-&gt;basePath.'/&#46;&#46;/images/imagepath here/'.&#036;image-&gt;name)) { 


                          &#036;model-&gt;setIsNewRecord(true);


                          &#036;model-&gt;pic_name =  &#036;imp;


                          &#036;model-&gt;id = null; 


                          &#036;model-&gt;save(); 


              }


		&#036;this-&gt;redirect(&#036;this-&gt;createUrl('picture/view')); 


	}


	&#036;this-&gt;render('create',array(


		'model'=&gt;&#036;model,


	)); //render the form


}

I think this is what u exactly asking …