Image Uploader is a client-side application which does not save files on server disk. It simply submits user-selected files to a page specified in its settings and redirects users to another page when the upload is completed. The present topic describes how to specify a page to which Image Uploader submits files and a page where Image Uploader redirects users when upload is successfully completed.
Besides these URLs, Image Uploader allows to specify:
All the upload-related parameters can be configured via the UploadSettings property of the Uploader class. Here the upload page is specified with the ActionUrl property, and the redirection page is specified with RedirectUrl.
<aur:Uploader ID="Uploader1" runat="server"> <UploadSettings ActionUrl="upload.aspx" RedirectUrl="gallery.aspx" /> </aur:Uploader>
$uploader = new Uploader("Uploader1"); $uploader->getUploadSettings()->setActionUrl("upload.php"); $uploader->getUploadSettings()->setRedirectUrl("gallery.php");
var u = $au.uploader({ id: 'Uploader1', uploadSettings: { actionUrl: 'upload.aspx', redirectUrl: 'gallery.aspx' } });
The ActionUrl specifies a URL to the page where files are posted. That page should contain the server code which
parses the upload request, saves files to the necessary folders on server, and performs other additional actions. Usually, this URL must have a specific extension (depending
on the web server settings). For ASP.NET platform it should be .aspx
, for PHP it is .php
, for Perl it can be
.pl
or .cgi
, etc. In other words, the file containing this script should have the extension registered in the settings
of your web server as a server page. Otherwise, upload would fail. If you want to submit files to the same page where Image Uploader is hosted,
specify the dot character (.
) as a value of this property.
When users upload files using the standard <input type="file">
element, they expect to be redirected to the page where they have submitted the
files. However, Image Uploader works in a different way. The response generated by the page, which is specified with the ActionUrl property, is sent back to Image Uploader and not to the browser. As soon as Image Uploader receives this response, the upload is considered completed; and the user is redirected to the page specified with the RedirectUrl property. If you do not need this redirection, set this property to an empty string.
When specifying these properties, take into account the following cases:
URLs can contain semicolon or quotation mark characters (e.g. http://upload.server.com/uploadFile;jsessionid=123?param='value'
). If they do, enclose such
URLs in single (' '
) or double (" "
) quotes to avoid parameter parsing errors. Moreover, quotation marks (both single
'
and double "
) inside URLs should be escaped with a backslash:
"http://upload.server.com/uploadFile;jsessionid=123?param=\'value\'"
URLs can be both absolute (e.g. "http://domain.com/Gallery/gallery.aspx"
) and relative to the current page (e.g. "/Gallery/gallery.aspx"
).
For instance, if Image Uploader is inserted into the http://domain.com/ImageUploader/default.aspx
page, the relative
URLs specified via the RedirectUrl property will correspond to the following locations.
Specified URL | Expected Location |
---|---|
"/Gallery/gallery.aspx" |
http://domain.com/Gallery/gallery.aspx |
"./Gallery/gallery.aspx" |
http://domain.com/ImageUploader/Gallery/gallery.aspx |
"Gallery/gallery.aspx" |
http://domain.com/ImageUploader/Gallery/gallery.aspx |
"gallery.aspx" |
http://domain.com/ImageUploader/gallery.aspx |
Image Uploader loads ActiveX control or Java applet depending on what browser is used on client side. ActiveX control will be loaded for Internet Explorer, and Java applet otherwise. You can customize this logic and set up Image Uploader to load Java applet in all browsers if you want to disable ActiveX for some reason; to perform this use the type property.
The following sample configures Image Uploader to load Java applet for any browser.
<aur:Uploader ID="Uploader1" runat="server" Type="java" />
var uploader = $au.uploader({ id: 'Uploader1', type: 'java', //other parameters... });
If you use Image Uploader PHP you can set the type property inside the PreRender event handler, like follows:
<script type="text/javascript"> function Uploader1_PreRender(){ $au.uploader('Uploader1').type('java'); } </script> <?php require_once 'ImageUploaderPHP/Uploader.class.php'; $uploader = new Uploader('Uploader1'); $uploader->getClientEvents()->setPreRender("Uploader1_PreRender"); //other parameters... $uploader.render(); ?>