Image View Select to Change
Requirements ¶
Yii 1.1 or above - tested on Yii 1.1.11 and above
Demo ¶
Usage ¶
- extract inside extensions directory
- be sure that your extensions are imported
/config/main.php
'import'=>array(
...
'application.extensions.*',
...
),
- add this to your view:
<?php
$this->widget('ext.imageSelect.ImageSelect', array(
'path'=>'path/to/current/image',
'alt'=>'alt text',
'uploadUrl'=>'url that accepts the uploaded image and returns the new path',
'htmlOptions'=>array()
));
?>
- In your controller you can catch the uploaded file like this sample upload action
public function actionUpload(){
$file = CUploadedFile::getInstanceByName('file');
// Do your business ... save on file system for example,
// and/or do some db operations for example
$file->saveAs('images/'.$file->getName());
// return the new file path
echo Yii::app()->baseUrl.'/images/'.$file->getName();
}
Change Log ¶
- 1.4
- Bug fix - hide the loading div after loading the new image instead of after uploading it
- 1.3
- Bug fix - for multi instance inside one page
- 1.2
- Adding the public property $text to facilitate internationalization
- 1.1
- Adding loader image while loading the new one
- 1.0
- Initial upload
Greate work, but
what is 'uploadUrl' means? is this an action that upload the image and save it then gives the returned path?
Re: Greate work, but
it is simply the url that the widget will post the image file to it, then it will handle this file [may save it to a database or file system, or add it to a model], then it should return the new image's path
demo
http://yii.nefya.com
BTW: I forgot to mention a sample upload action
public function actionUpload(){ $file = CUploadedFile::getInstanceByName('file'); $file->saveAs('images/'.$file->getName()); echo Yii::app()->baseUrl.'/images/'.$file->getName(); }Very Nice
Thank you for this awesome extension!
Example
Can you please give an example of the 'url' portion. I have tried numerous ways and can't get it to work. How could I use a model behaivour to change the image. i.e.
public function behaviors() { return array( 'image' => array( 'class' => 'ext.AttachmentBehavior.AttachmentBehavior', # Should be a DB field to store path/filename 'attribute' => 'filename', # Default image to return if no image path is found in the DB 'fallback_image' => 'images/default.png', 'path' => "images/companies/products/:id.:ext", 'processors' => array( array( # Currently GD Image Processor and Imagick Supported 'class' => 'GDProcessor', 'method' => 'resize', 'params' => array( 'width' => 540, 'height' => 540, 'keepratio' => true ) ) ), 'styles' => array( # name => size # use ! if you would like 'keepratio' => false 'thumb' => '!270x270', ) ), .....Re: Example - 'url' portion
Here is an example
'uploadUrl'=>$this->createUrl('upload', array('attr'=>'logo'))about the action, as mentioned above, you can catch the file and do anything with it
Multiple instances on a page
I see from the change log that you made a "Bug fix - for multi instance inside one page"
However I'm trying to have two instances on a page and only the second one works, clicking the first produces the loading image, but the upload action doesn't get called.
Am I missing something obvious in the set up?
Re: Multiple instances on a page
Dear fgpsmith,
I have updated my demo page to include two instances, and it is working well, so please can you provide with more details to be able to assist you...
http://yii.nefya.com/
Note: be sure you are using the latest version :)
Re: Multiple instances on a page
The demo page seems to be down at the moment so I can't check that.
I have added two instances of the widget immediately after each other on the page. The later one works. The first one doesn't. If I swap the position of the two widgets it's still the second one that works so it is position dependant.
The earlier one doesn't work in that the ajax loading image is displayed over the original picture but the post is never made to the upload action, I've watched the log and I can see the get for the ajax image but there is no post. (I do see the post with the later, working widget).
I was the 1.4 version that I downloaded (although there isn't a version number in the code). Looking at the code in the run method I did notice that the form is always "frm_img_select", it doesn't have any unique id attached with it so it looks like both generated forms will have the same id. I wanted to check the demo page to see if that was the case in the working example, but as I said I can't get to the demo at the moment.
The only other thing that might be having an effect is that there is another form on the page?
Re: Multiple instances on a page
Dear fgpsmith
WebHostingHub is down for the first time in a year :D, please just wait ...
until they resolve their problem please mail me [amr at nefya dot com] (or) reply with your view code so I can help
BTW: yes the latest version should generate a unique id
Thanks,
Amr
Re: Multiple instances on a page
OK - it was my fault (as suspected). The image uploaders were nested inside the other form on the page. If I move them outside the form both work fine. So I just need a bit of CSS magic to have them outside the form but positioned as if they are inside it.
Re: Multiple instances on a page
You're most welcome
Good extensions
Nice works, I use it. Thanks
errors
hi. can you please explain how to handle errors? say the ->saveAs fails or the model validation fails (incorrect immage type uploaded), how can you return an error message to the page? thanks
Re: errors
I have developed this extensions more than a year ago I think it was very simple code is not that good ... backend of the widgets can return only one thing "an image url" so I think a good way "if you do not wan tot change the widget's code" is to handle errors on server and just return a "default-image.jpg url" or "error.jpg url" I know this is not the best solution but this should work
'path'=>'path/to/current/image',
could some one please tell me how this line works? i want to show my image here just like in the demo where an already image is being displayed. How can i do this ???
Re: path'=>'path/to/current/image',
I can help
but I do not understand your question
plz contact me skype: amr.bedair
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.