[Extension] Xupload

Can you please show the generated javascript code?

callback contains:




function () {

                handler.initDownloadRow(event, files, index, xhr, handler, function () {

                    if (typeof handler.onComplete === func) {

                        handler.onComplete(event, files, index, xhr, handler);

                    }

                });

            }




this inthe source of page:




/*<![CDATA[*/

jQuery(function($) {

jQuery("#images").MultiFile({'accept':'jpg|png|gif','max':10});

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

                            console.log("upload finish");

                        },'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>');


}});

});

/*]]>*/

</script>



the documentation says that the funcion only receives the following parameters:

event, files, index, xhr, handler

and you are trying to recevie an extra ‘callback’ parameter on the ‘onComplete’ event, also if you remove that event, does the plugin work correctly?

No, i delete this parameter. Set of parameters does not change the result

And my other question?

does the plugin work corretly when you remove the whole onComplete event callback?

Hi, I included this into a form I have but not sure how to incorporate basic functionality. I have been through all the docs and anything I could find on it. I just want to be able to upload files (and hopefully rename them) into a directory and store a path into my db. Is there some guidance somewhere on how to get me started with this?

Have you checked the included demos?

Asgaroth, I appreciate the response. Yes I have been through those files, like I said anything I could find on the topic. I just need a booster to get running with it. Sorry should have included some of what I have done. Here is just where things stand now since I have tried a variety of things. I tried incorporating actionMultiple into my actionUpload in the controller but that didn’t work. Since I included your code into my form I assume they should be together?


//controller

public function actionUpload() {

$model = new Image;


if (isset($_POST['Image'])) {

	$model->setAttributes($_POST['Image']);


	if ($model->save()) {

		if (Yii::app()->getRequest()->getIsAjaxRequest())

			Yii::app()->end();

		else

			$this->redirect(array('view', 'id' => $model->ImageId));

	}

}


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

}


public function actions()

{

    return array(

        'upload'=>array(

            'class'=>'ext.xupload.actions.XUploadAction',

    		'subfolderVar' => 'ImageId',

    		'path' => realpath(Yii::app()->getBasePath()."/../images/uploads"),

        ),

    );

}


public function actionMultiple(){

    $model = new XUploadForm;

    $this->render('multiple', array(

        'model' => $model,

    ));

}

The form appears and allows me to select files. When I click upload my form is submitted but files are not put into the called directory.


//view - within an existing form 

<?php

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

    'url' => Yii::app()->createUrl("image/upload", array("ImageId" => 1)),

    'model' => $model,

    'attribute' => 'file',

    'multiple' => true,

));

?>

Why do you have an actionUpload in your controller?

It is overriding the XUploadAction which has the logic for moving files. remove your upload actions which is not doing anything

My only response to that is because I was trying to include this as part of another form. Taking your advice and trying to start from square one without introducing other attributes into the upload process. This is what I have now.


//controller

public function actions()

{

    return array(

        'upload'=>array(

            'class'=>'ext.xupload.actions.XUploadAction',

    		'subfolderVar' => 'ImageId',

    		'path' => realpath(Yii::app()->getBasePath()."/../images/uploads"),

        ),

    );

}


public function actionMultiple(){

$model = new ImageUpload;

$this->render('multiple', array(

'model' => $model,

));

}


public function actionError()

{

 if($error=Yii::app()->errorHandler->error)

 {

 	if(Yii::app()->request->isAjaxRequest)

 		echo $error['message'];

 	else

     	$this->render('error', $error);

 }

}




//view (complete titled Multiple)

<?php $this->pageTitle=Yii::app()->name; ?>


<h1>Multiple file upload example</h1>




<?php

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

					'url' => Yii::app()->createUrl("imageUpload/upload", array("ImageId" => 1)),

                    'model' => $model,

                    'attribute' => 'file',

		    'multiple' => true,

));

?>

With this in firebug I get a 500 error with a JSON.parse: unexpected character jquery.js (line 561). This is after I select my images and hit upload.

If I can get the basics working I am sure I can run from there but as you can see I am not even getting that far.

and whats the JSON response from the server?

Did you want to see the generated javascript? Sorry I am new to t/s json but thought firebug would show JSON responses as javascript objects in its own tab under NET. I see nothing there though. My source does have the generated js if that is what you are talking about.

not the generated javascript, but the server JSON response, you (probably) can see that in the console. it is not clear to me if you got the demos working? what you are trying to do should be no problem, is the same funcionality as that of the demo.

Yeah the JSON response isn’t showing up at all. This is the error I get, although it does exist.


<h1>CHttpException</h1>

<p> does not exists. (.../protected/extensions/xupload/actions/XUploadAction.php:98)</p><pre>#0 .../protected/extensions/xupload/actions/XUploadAction.php(117): XUploadAction->init()

I am almost using your code directly just a couple of renames to fit my app. I will load the demos directly without my app and see if it works there. If so it will give me the basis to move forward.

Ok even when trying the demos on a clean build I still get a 500 error although this time the response is “does not exists.” without any further details. Since I am not getting anything with Firebug do you have any other ideas on how I can track down why nothing is happening. It’s confusing though because it allows me to pick a file then it gives a status bar as if it is uploading and that goes away but nothing happens.

I see you have:





//controller

public function actions()

{

    return array(

        'upload'=>array(

            'class'=>'ext.xupload.actions.XUploadAction',

                'subfolderVar' => 'ImageId',

                'path' => realpath(Yii::app()->getBasePath()."/../images/uploads"),

        ),

    );

}

but does the folder exists? /var/www/youapp/images/uploads ? if not then thats the reason you are gettung an error, because realpath is returning false, thus setting the "path" attribute of the action to nothing.

Hi enfield and Asgaroth. I am still quite new to Yii and your thread really helped me; thank you so much.

These are the errors I had if it helps anyone else.

1: 500 CHttpException -

  • the folder was named “upload” instead of “uploads” (missing ‘s’)

2: <b>Fatal error</b>: Call to a member function getType() on a non-object

  • ‘new XUploadForm’ wasn’t being called anywhere for the xupload widget’s expected model

Asgaroth, thanks this was my problem. I had the folder but as Jesse brought up I too left the "s" off. I am now uploading. I appreciate the help and definitely appreciate the extension. It is very helpful.

Thanks Jesse, Now can you please let me know who granted you access to my box since you found my error?

Hi,

I’ve installed this extension, and have been using it to successfully upload smaller files. But I can’t upload larger files and cannot figure out what I need to do to increase the file size limit.

This is what I’ve been getting in the log.


2011/08/23 08:49:19 [error] [application.extensions.xupload.actions.XUploadAction] XUploadAction: array

(

    'file' => array

    (

        '0' => 'The file \"apache-maven-3.0.3-bin.zip\" is too large. Its size cannot exceed 2097152 bytes.'

    )

)

Can anyone help me, I’ve been working on this for a while now. I tried setting the filesize with the following:


        

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

        array('url' => 'upload', 

        'model' => $uploadform, 

        'attribute' => 'file', 

	'options' => array(

		'maxFileSize' => '1000000000',

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

			form = document.forms["product-submission-submit-form"];

			elem = form.elements["ProductSubmission_file_location"].value = handler.response.filepath;

			elem = form.elements["ProductSubmission_filename"].value = handler.response.name;

		}',

	)));



And have tried a bunch of things including combing through the Javascript code, but this escapes me.

You need to allow PHP to receive larger files: search your php.ini for upload_max_filesize and post_max_size and modify them acordinly