Why Multiple File Upload Is Not Working?

Hi All,

I have tried so many ways to make multiple file upload workable using CMultiFileUpload widget. Already, I have checked and followed below links-

http://www.yiiframew…le-file-upload/

http://www.yiiframew…MultiFileUpload

http://www.yiiframew…ultifileupload/

http://www.yiiframew…ultifileupload/

http://www.codexampl…ultifileupload/

http://stackoverflow…leupload-in-yii

http://stackoverflow…ple-file-upload

BUT still no luck!!

Here is my code:

View:


<?php $form=$this->beginWidget('CActiveForm', array(

	'id'=>'images-form',

 	'method'=>'post',

	'enableAjaxValidation'=>false,

 	'enableClientValidation'=>false,

	'htmlOptions' => array('enctype' => 'multipart/form-data'), 

)); ?>


	<?php

	$this->widget('CMultiFileUpload', array(

 	'model'=>$model,

 	'name'=>'image_filename',

 	'attribute'=>'image_filename',

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

 	'options'=>array(

    	// 'onFileSelect'=>'function(e, v, m){ alert("onFileSelect - "+v) }',

    	// 'afterFileSelect'=>'function(e, v, m){ alert("afterFileSelect - "+v) }',

    	// 'onFileAppend'=>'function(e, v, m){ alert("onFileAppend - "+v) }',

    	// 'afterFileAppend'=>'function(e, v, m){ alert("afterFileAppend - "+v) }',

    	// 'onFileRemove'=>'function(e, v, m){ alert("onFileRemove - "+v) }',

    	// 'afterFileRemove'=>'function(e, v, m){ alert("afterFileRemove - "+v) }',

 	),

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

 	'max'=>10, 

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

   ));

  ?>


	<div class="row buttons">

 	<?php echo CHtml::submitButton($model->isNewRecord ? 'Add' : 'Save'); ?>

	</div>

	<?php $this->endWidget(); ?>

Controller:

When I use GET method to see the form submit functionality then I found its displaying file name after submission. But, using POST method I did not see the name inside


if(isset($_POST['Images']))

. Even I failed see echo result inside


if(isset($_POST['Images'])) 


public function actionPhoto()

{ 			

	$model=new Images;

	if(isset($_POST['Images']))

	{

		echo 1;//Test purpose. Not displaying after form submission!!


		$model->attributes=$_POST['Images'];


		$image_filename = CUploadedFile::getInstancesByName('image_filename');


		// proceed if the images have been set

		if (isset($image_filename) && count($image_filename) > 0)

		{

			// go through each uploaded image

			foreach ($image_filename as $image_filename => $pic)

			{

				echo $pic->name.'<br />';//Check purpose


				if ($pic->saveAs(Yii::getPathOfAlias('webroot').'/images/'.$pic->name))

				{  

					$Images = new Images();

					$Images->image_filename = $pic->name;


					$Images->save();

				}

			}

		}

	}


	$this->render('photo',array('model'=>$model));

}

Model rules:


public function rules()

{

	return array(

		array('image_filename', 'file', 'types'=>'jpg, jpeg, png, gif','allowEmpty'=>false, 'on'=>'insert'),    	

		array('id, image_filename', 'safe'),

		array('id, image_filename', 'safe', 'on'=>'search'),

	);

}

What is wrong in my code?

Thanks for your help & kind co-operation.

Maybe a typo $image_filename <-> image_filename





$image_filename = CUploadedFile::getInstancesByName('$image_filename'); //<-- wrong name

$image_filename = CUploadedFile::getInstancesByName('image_filename'); // <--




Thanks Joblo. Yes, In my post it should be only attribute name without variable sign. I have updated my post. I have tried but not getting anything inside


if(isset($_POST['Images'])) 

If you don’t have a non-file attribute of the images model in your form (album,title…),

there will be no $_POST['Images] because a file input will only populate $_FILES.

In this case you can use


if(!empty($_FILES)

instead of


if(isset($_POST['Images']))

And ensure, that your form has the enctype multipart/form-data set:

You have to set


'enctype' => 'multipart/form-data'

in the htmlOptions of your form.

Otherwise the $_FILES will be empty too.

I have non-file attribute also in the form. If I use


if(!empty($_FILES)

then how to use attribute in


 $image_filename = CUploadedFile::getInstancesByName('image_filename');

?

if no data submitted from the form ($_POST(‘Images’ is empty) and you have other than file fields in the models form, your form is wrong.

Can you post the form code?

You don’t have to change the file-handling (


$image_filename = CUploadedFile::getInstancesByName('image_filename');

). CUploadedFile checks the $_FILES variable.

Hi Joblo,

Thanks for your excellent help. I already fixed that issue. Now I am struggling to make this workable for cloned file field in one single form.

I am using your JQRelcopy extension to do this. Would you please help me to figure out this issue.

Here is my code-


	

<?php $form=$this->beginWidget('CActiveForm', array(

					'id'=>'soccer-form',

					'enableAjaxValidation'=>false,

					'htmlOptions' => array('enctype' => 'multipart/form-data')

				)); 

				Yii::import('ext.jqrelcopy.JQRelcopy');	

				?>

	

			<div class="match-events">	

				<div class="row">

					<div class="col-xs-10">

						<?php echo CHtml::label('Soccer Match Name',''); ?>

						<?php echo CHtml::textField('Soccer[name][]','',

						array('class'=>'form-control','maxlength'=>128)); ?>	

					</div>

	

	

					<div class="col-xs-8">

						<?php echo CHtml::label('Match Date',''); ?>

						<?php

							$dateval= array(

									'name'=>'Soccer[match_date][]',

									'attribute' => 'match_date[]',

									'language'=> 'en',

									'options'   => array(

											'dateFormat' => 'mm/dd/yy',

									),

									'htmlOptions'=>array(

										'class'=>'form-control',

										'style'=>'width:150px;'

									),							               

								);

						$this->widget('ext.jui.EJuiDateTimePicker',$dateval); 					

						?>

					</div>

					

					<div class="col-xs-12">

							<?php echo CHtml::label('Upload Images',''); ?>

							<?php 

								$this->widget('CMultiFileUpload', array(

					             'model'=>$Images,

					             'name'=>'image_filename',

					             'attribute'=>'image_filename',

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

					             'options'=>array(

							

					             ),

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

					             'duplicate' => 'Duplicate file!',

					             'remove'=>'Remove Image',


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

								));

							?>	

					</div>	

				</div>

			</div>

									

				<?php

				$this->widget('ext.jqrelcopy.JQRelcopy',

				array(

					'id' => 'match-events',

					'removeText' => 'Remove', 

					'removeHtmlOptions' => array('style'=>'color:red; margin-left:30px;'),

					'jsAfterNewId' => JQRelcopy::afterNewIdDateTimePicker($dateval),

					'options' => array(

						'clearInputs'=>true,

					)          	

				));

				?>

				<div class="add-items">

					<a id="match-events" href="#" rel=".match-events" class="btn btn-default btn-lg active" role="button">

						Add Another Soccer Match

					</a>

				</div>

				

				

				<?php $this->widget('bootstrap.widgets.TbButton', array(

						'buttonType'=>'submit',

						'type'=>'primary',

						'htmlOptions'=> array('id'=>'match-create','name'=>'save_match'),

						'label'=>'Save and Submit',

					)); ?>

			


				<?php $this->endWidget(); ?>

It is not giving me to pick multiple images on different cloned row. Always it is moving to original row.

I hope you can give the trick that I should need to apply.

Thanks again Mr. Joblo…

It’s not easy to implement with JQRelCopy.

But I have implemented file-field support in my multimodelform extension.

I needs some testing, but I think I can publish the next release in a few days.