[Extension] Xupload

Hi, you have to add the next line to your php.ini:

post_max_size = XXM

and adjust the next:

upload_max_filesize = XXM

and change XX for the size that you need.

But how to get the file index in multiple upload?

The view

<?php

$this->widget(‘ext.xupload.XUploadWidget’, array(

'url' =&gt; Yii::app()-&gt;createUrl(&quot;casa/uploadimg&quot;, array(&quot;parent_id&quot; =&gt; 1, &quot;id&quot; =&gt; &#036;model-&gt;cod_casa,)),


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


'attribute' =&gt; 'file',


'options' =&gt; array(


    'beforeSend' =&gt; 'js:function (event, files, index, xhr, handler, callBack) {


				        handler.uploadRow.find(&quot;.file_upload_start button&quot;).click(callBack);


				    }'


),

));

?>

<button id="start_uploads" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary">

&lt;span class=&quot;ui-button-icon-primary ui-icon ui-icon-circle-arrow-e&quot;&gt;&lt;/span&gt;


&lt;span class=&quot;ui-button-text&quot;&gt;Start Uploads&lt;/span&gt;

</button>

<script type="text/javascript">

&#036;('#start_uploads').click(function () {


    &#036;('.file_upload_start button').click();


});

</script>

the controller how to get for instance the 2ºfile

ex:$model->file = CUploadedFile::getInstance($model2, ‘file[2]’); ?

i don’t get it , 2 days trying

i got the json objects but how can i reference it to save in db

You don’t need to get the file index as all of the files in a multiple upload are treated as individual form submissions (meaning the index will always be 0 for every file).

Thanks anyway, but i need to write the path of the file in db

ex: $model->myimg1=file[1]

 &#036;model-&gt;myimg2=file[2]

what does multiple=tru2 does?

theres no parameter in json that tell me the number of files ?

onComplete does not work for me with the latest version, has anyone else experienced this issue?

Also, when I include this extension it breaks all of my jquery theming.

Any thoughts?

php:




<?php

  

  $this->widget('ext.xupload.XUploadWidget', array(

                'url' => $this->createUrl('/media/upload', array('itemId'=>$item->id)),

                'name' => 'file',

                'multiple'=>true,

                'options' => array(

                  'sequentialUploads' => true,

                  'acceptFileTypes' => '/(\.|\/)(gif|jpeg|png)$/i',

                  'onComplete' => 'js:function (event, files, index, xhr, handler, callBack) {

                    alert(1);

                  }',

                  'formatBytes' => 'js:function (bytes)

                  {

                    if (bytes >= 1000000000) {

                        return (bytes / 1000000000).toFixed(2) + " GB";

                    }

                    if (bytes >= 1000000) {

                        return (bytes / 1000000).toFixed(2) + " MB";

                    }

                    if (bytes >= 1000) {

                        return (bytes / 1000).toFixed(2) + " KB";

                    }

                    return bytes + " B";

                  }',

                ),

                'themeUrl'=>Yii::app()->theme->baseUrl . '/jui-themes',

                'theme'=>Yii::app()->params['juiTheme'],

  ));

?>



generated:


jQuery('#XUploadWidget_form').fileUploadUI({'sequentialUploads':true,'acceptFileTypes':'/(\\.|\\/)(gif|jpeg|png)$/i','onComplete':function (event, files, index, xhr, handler, callBack) {


                    alert(1);


                  },'formatBytes':function (bytes)


                  {


                    if (bytes >= 1000000000) {


                        return (bytes / 1000000000).toFixed(2) + " GB";


                    }


                    if (bytes >= 1000000) {


                        return (bytes / 1000000).toFixed(2) + " MB";


                    }


                    if (bytes >= 1000) {


                        return (bytes / 1000).toFixed(2) + " KB";


                    }


                    return bytes + " B";


                  },'uploadTable':'#files','downloadTable':'#files','buildUploadRow':function (file, index) {


	return $('<tr>'+


		'<td class="filename">'+file[index].name+'</td>'+


		'<td class="filesize">'+file[index].name+'</td>'+


		'<td class="file_upload_progress"><div></div></td>'+


		'<td class="file_upload_start" style="display:none">'+


			'<button class="ui-state-default ui-corner-all" title="Start Upload">'+


				'<span class="ui-icon ui-icon-circle-arrow-e">Start Upload</span>'+


			'</button>'+


		'</td>'+


		'<td class="file_upload_cancel">'+


			'<button class="ui-state-default ui-corner-all">'+


				'<span class="ui-icon ui-icon-cancel">Cancel</span>'+


			'</button>'+


		'</td>'+


	'</tr>');


},'buildDownloadRow':function (files, index) {


	return $('<tr><td>' + files.name + '<\/td>' +


    	'<td class="file_upload_progress"><div><\/div><\/td>' +


    	'<td class="filesize">'+files.size+'</td>' +


        '<td class="file_upload_cancel">' +


        '<button class="ui-state-default ui-corner-all" title="Cancel">' +


        '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' +


        '<\/button><\/td><\/tr>');


}});

Led, I assume you’re using the XUploadAction. This action runs for each file that gets uploaded. XUpload does not run like a tabular input form so there is no file index number. Copy the lines commented below to save the filename to db.




	public function run()

	{

		$this->init();

		$model = new XUploadForm;

		$model->file = CUploadedFile::getInstance($model, 'file');

		$model->mime_type = $model->file->getType();

		$model->size = $model->file->getSize();

		$model->name = $model->file->getName();


		if ($model->validate()) {

			$path = $this->path."/".$this->_subfolder."/";

			if(!is_dir($path)){

				mkdir($path);

			}

			$model->file->saveAs($path.$model->name);


			// Copy the following lines to save the filename to db

			$post = new Post(); // Create a new instance of your model

			$post->myimg = $model->name; // Where myimg is the attribute to hold the filename

			$post->save();

			// End of copy 


			echo json_encode(array("name" => $model->name,"type" => $model->mime_type,"size"=> $model->getReadableFileSize()));

		} else {

			echo CVarDumper::dumpAsString($model->getErrors());

			Yii::log("XUploadAction: ".CVarDumper::dumpAsString($model->getErrors()), CLogger::LEVEL_ERROR, "application.extensions.xupload.actions.XUploadAction");

			throw new CHttpException(500, "Could not upload file");

		}

	}



my code dont work,

$this->widget(‘ext.xupload.XUploadWidget’, array(

'url' =&gt; Yii::app()-&gt;createUrl(&quot;casa/uploadimg&quot;, array(&quot;parent_id&quot; =&gt; 1, &quot;id&quot; =&gt; &#036;model-&gt;cod_casa,)),


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


'attribute' =&gt; 'file',


'options' =&gt; array(


    'onComplete' =&gt; 'js:function (event, files, index, xhr, handler, callBack) {


    &#036;(&quot;#yt0&quot;).trigger(&quot;click&quot;);


                    }',


    'beforeSend' =&gt; 'js:function (event, files, index, xhr, handler, callBack) {


				        handler.uploadRow.find(&quot;.file_upload_start button&quot;).click(callBack);


				    }'


),

));

please need help please just need to trigger a click

my code dont work,also


$this->widget('ext.xupload.XUploadWidget', array(

'url' => Yii::app()->createUrl("casa/uploadimg", array("parent_id" => 1, "id" => $model->cod_casa,)),

'model' => $model,

'attribute' => 'file',

'options' => array(

'onComplete' => 'js:function (event, files, index, xhr, handler, callBack) {

$("#yt0").trigger("click");

}',

'beforeSend' => 'js:function (event, files, index, xhr, handler, callBack) {

handler.uploadRow.find(".file_upload_start button").click(callBack);

}'

),

));

did you find a solution . Thanks

Like others, I’m having issues getting the callback to help… anyone have any advice?

This is the code:




<?php

$this->widget('ext.xupload.XUploadWidget', array(

                    'url' => Yii::app()->createUrl("talent/upload",array('id'=>$_GET['id'])),

                    'model' => new Images,

                    'attribute' => 'image',

					'options' => array('onComplete' => 'js:function (event, files, index, xhr, handler) {

        alert();

                        }'

),

));

?>                        </div>



And this is the rendered out code:




jQuery('#Images_form').fileUploadUI({'onComplete':function (event, files, index, xhr, handler) {


        alert();


                        },'uploadTable':'#files','downloadTable':'#files','buildUploadRow':function (file) {


	return $('<tr>'+


		'<td class="filename">'+file[0].name+'</td>'+


		'<td class="filesize">'+file[0].name+'</td>'+


		'<td class="file_upload_progress"><div></div></td>'+


		'<td class="file_upload_start" style="display:none">'+


			'<button class="ui-state-default ui-corner-all" title="Start Upload">'+


				'<span class="ui-icon ui-icon-circle-arrow-e">Start Upload</span>'+


			'</button>'+


		'</td>'+


		'<td class="file_upload_cancel">'+


			'<button class="ui-state-default ui-corner-all">'+


				'<span class="ui-icon ui-icon-cancel">Cancel</span>'+


			'</button>'+


		'</td>'+


	'</tr>');


},'buildDownloadRow':function (files, index) {


	return $('<tr><td>' + files.name + '<\/td>' +


    	'<td class="file_upload_progress"><div><\/div><\/td>' +


    	'<td class="filesize">'+files.size+'</td>' +


        '<td class="file_upload_cancel">' +


        '<button class="ui-state-default ui-corner-all" title="Cancel">' +


        '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' +


        '<\/button><\/td><\/tr>');


}});

 

Regarding onComplete callback , I use this:


<?php 

	$XUpload = new XUploadForm;

	$this->widget('ext.xupload.XUploadWidget', 

					array(

						'url' => Yii::app()->createUrl("file/upload", 

						array("parent_id" =>User::USER_DIR . Yii::app()->user->id ) ),

						'model' => $XUpload,

						'attribute' => 'file',

						'options'=>array(

						'onComplete' => 'js:function (event, files, index, xhr, handler, callBack) {

							$("#User_avatar").val(\'\'+handler.response.name + \'\' );

							}'),

	));

?>

I put it OUTSIDE the form.

#User_avatar means my model class is User, and the table column in which i want to store the filename is avatar.

Inside the form I have

&lt;?php echo &#036;form-&gt;hiddenField(&#036;model,'avatar',array('size'=&gt;60,'maxlength'=&gt;255)); ?&gt;

Which is populated with the failname (after the upload action has done its work with it).

so when the user then presses the form’s submit button the filename is saved into my avatar column

in the database.

Have a solutio


'parseResponse' => 'js:function () {

            

            $("#yt0").trigger("click");

use parseResponse

is there a way to use this extension to make single file uploads? I mean I want the users to be able to upload only 1 file, like uploading their profile picture etc.

Thanks in advance.

[size="5"]How to create callback function when upload failed?[/size]

(i have posted this question on SO at stackoverflow.com/questions/9696056/how-to-create-callback-function-when-upload-failed-by-xupload-extension-on-yii . Sorry, i’m newbie so i can insert link)

I’m using XUpload Extension to multiupload onto my site base yii framework. It’s work very well. Untill i try rename upload folder, xupload upload failed! i can predict this case. But i don’t know how to create callbacks when the upload is successful or when it fails to show notification on my site:

This is my code:


$this->widget(

            $className  = 'ext.xupload.XUploadWidget',

            $properties = array(

                'url' => Yii::app()->createUrl("Upload/multiupload", array("sessionId" => $sessionId)),

                'model' => $model,

                'attribute' => 'file',

                'multiple'=>true,

                'options' => array(

                    'beforeSend' => 'js:function(event, files, index, xhr, handler, callBack) {

                        handler.uploadRow.find(".file_upload_start button").click(callBack);

                        $("#start_imports").hide();

                    }',

                    'onComplete'=>'js:function(event, files, index, xhr, handler, callBack) {

if(xhr.status==200) {

                            $("#uploadWrapper table#files tr td.file_upload_progress div").html("Ready to import>");

                            $("#start_imports").show();

                        } else {

                            $("#notification").html("Error: "+xhr.status);

                            $("#notification").show();

                        }


                    }',

                ),

                'htmlOptions'=>array('uploadFolder'=>$sessionId)

            )

        );

You can see onComplete event running when upload successful, but it doesn’t wen upload fail.

what? it is working, I posted my solution for others that said they didnt manage to make callback work.

For those who are still struggling to upload image I have create a Step By Step Tutorial

goo.gl/AYBTV

hello guys,

sorry for my English.

I tried to install this exstension,

everything is ok, but I can not erase. The "Cancel" button is disabled.

What can I check?

thank you very much

Giuseppe

The extension has been finally updated and moved to GitHub!

XUpload Extension for Yii

Please download and comment, any feedback is apreciated

This is weird:s

I had the old extention working without problems, now when I tried to update to the new version nothing happends after selecting a file.

I’ve tried cleaning the assets folder, and to be sure I added the aliases code to the main config file and also replaced my old widget call with the example code you provided.

I have also tried in two diffrent yii-apps.

The uploadform appears, I press add files, select one file and press "open".

Then litterly nothing happends, no errors found by firebug. The file does not appear on the page, everything looks exactly as it does on load.

I’ve ran out of ideas to test, any suggestion?

Thats weird indeed, do you have the "Net" tab enabled in firebug? perhaps it is not properly loading assets.

Same here. “Net” tab is enabled. I can’t find a solution either.