Yii CMultiFileupload

DONT FORGET multipart/form-data

<?php 
$form=$this->beginWidget('CActiveForm', array(
    'id'=>'files-form',
    'htmlOptions'=>array('enctype' => 'multipart/form-data'),
));?>

Properties

CMultiFileUpload generates a file input that can allow uploading multiple files at a time. It have the following properties.

accept - Allowed file types
duplicate   - String message
file        - File name
htmlOptions - additional html options
id          - CMultiFileUpload widget id
max         - max number of files to be upload
model       - data model
name        - Input file tag name
remove      - (String) label for remove button
selected    - Message when selected file
and more..

CMultifile In View

The below sample CMultiFileUpload widget have the following client side validation max file size, file types, duplicate message, denied message.

<div class="form">
    <?php $form=$this->beginWidget('CActiveForm', array(
        'id'=>'files-form',
        'enableAjaxValidation'=>false,
        'htmlOptions'=>array('enctype' => 'multipart/form-data'),
    )); 
    ?>
	
    <p class="note">Fields with <span class="required">*</span> are required.</p>

    <?php echo $form->errorSummary($model); ?>
	
    <div class="row">
        <?php echo $form->labelEx($model,'yiifile'); ?>   
    <?php
    $this->widget('CMultiFileUpload', array(
        'model'=>$model,
        'name' => 'yiifile',
        'max'=>5,
        'accept' =>'pdf|xml',
        'duplicate' => 'Duplicate file!', 
        'denied' => 'Invalid file type',
    ));  
    echo $form->error($model,'yiifile'); 
    ?>  
</div>
..............
..............
<?php $this->endWidget(); ?>
</div><!-- form -->

CMultifile In controller

 public function actionFile()
{    
    $filemodel=new Files;  
    if(isset($_POST['Files']))
    {
        $model->attributes=$_POST['Files'];
        $filelist=CUploadedFile::getInstancesByName('yiifile');
        foreach($filelist as $thefile)
        {   
            $randno=rand(11111,99999);                                        
            $filename=$randno.$thefile->name;
            $dir='/files/livefiles/'.$fileid;                                  
            $fileext=$thefile->extensionName;                      
            $filemodel=new Files;
            $filemodel->Size=$thefile->size; 
            $filemodel->Path=$dir.'/'.$filename; 
            $filemodel->Filename=$filename;
            $filemodel->filetype    =$thefile->extensionName;
            // check model validation
            if($filemodel->validate())
            {
                if($thefile->saveAs($saveas))
                {
                    $filemodel->save();
                }                             
            }                                                   
        }                                
    }        
    .............
    .............
}    

Model Validation

All Rules and validation in Yii Model

CMultiFileUpload widget function

CMultiFileUpload widget have some functions. They are 'onFileSelect', 'afterFileSelect', 'onFileAppend', 'afterFileAppend', 'onFileRemove', 'afterFileRemove'. Using this function we can do more actions on file uploading time.

<?php
$this->widget('CMultiFileUpload', array(
    'model'=>$model,
    'attribute'=>'files',
    'accept'=>'jpg|gif',
    '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) }',
    ),
));
?>

Maximum File Size Validation On Before Upload

This sample only for single file uploaded. The form contains only one input file tag. I used CMultiFileUpload to upload single file.

<?php 
$this->widget('CMultiFileUpload', array(
    'model'=>$model,
    'name' => 'excelfile',
    'max'=>1,
    'accept' => 'csv',
    'duplicate' => 'Duplicate file!', 
    'denied' => 'Invalid file type', 
    'options'=>array(
        'onFileSelect'=>'function(e ,v ,m){
            var fileSize=$("#excelfile")[0].files[0].size;
            if(fileSize>1024*1024){//1MB
                alert("Maximum file size 1MB only");
                $("#importprice-form").reset();
                return false;
            }
        }'  
    )
)); 
?>