Media Field

[francodacosta]

I have created a form field to upload and preview uploaded files.
It's very useful to me and I use it a lot on my cms so thought sharing it with all of you.

Some of it's features are


Preview uploaded Images, Flash Files, and Regular Files (icon only)
Styled input field - can be used as a replacement for input file fields
Compact size only occupies the space of a standard text box when closed
Delete File callback - useful in forms so you can delete a file without resubmiting the form
Only shows the file name, not the complete path
FakeFileName - you can have your file with and unique name (345653456765456.jpg) and show as if it was 'Garden.jpg'


Preview

http://www.francodacosta.com/usr/images/extjs/ext-media-field-closed.jpg

demo & download
project page (http://www.francodacosta.com/extjs/mediafield)

cheers

[zhw511006]

Good Work;

But how to make it to preview picture? If i don't set the value!

Thank you for help!

[francodacosta]

You can only preview pictures that are already on the server (that's a javascript security measure)

If you do not set the value there is nothing to preview and the media field will act as an styled replacement of the standard file upload field

[mystix]

Love it! =D>

one tiny thing -- the textfield itself isn't styled (with a light-blue border) when you mouse over it, though the browse button is.

[francodacosta]

The text field can be styled, I choose not to because of IE, in firefox makes sense since you can click on any area of the input field to show the browse dialog, but on IE you can only click the button.

Let me find out a way to work around this beauvoir in IE first, this should not be difficult as IE allows you to call the input field click() method to show the browse dialog

Regards

Nuno