Help us to translate this website and improve this translation!
English | Castellano

How to Use the FileUpload AJAX Control

Custom Javascript

For additional functionality, we can add extra javascript to add extend our FileUploadAJAX, handling 10 possible events:
  • preLoad: before the first call to the uploader.
  • postLoad: when the control has loaded.
  • preAdd: before the Add event, which was used to add a new file to the uploader.
  • postAdd: after executing the Add event.
  • preDelete: before deleting a file.
  • postDelete: after deleting a file.
  • preHide: before hiding a file or an uploader.
  • postHide: after hiding a file or an uploader.
  • preUpload: before beginning to upload the file.
  • postUpload: after uploading the file.
In both the PostUpLoad event and the PreDelete event, we can access the file information (HttpPostedFileAJAX), whose variable name is the same as the HttpPostedFileAJAX properties. In the example Custom Javascript 2 this is easier to see.

Subsequently a very simple example is shown with each of the event handlers. In later examples we will focus on the most important event: postUpload.


<cc1:FileUploaderAJAX ID="FileUploaderAJAX1" runat="server" MaxFiles="5" />
// Código dentro del Page_Load
if (!Page.IsPostBack)
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.preLoad, "alert('preLoad');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postLoad, "alert('postLoad');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.preAdd, "alert('preAdd');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postAdd, "alert('postAdd');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.preDelete, "alert('preDelete');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postDelete, "alert('postDelete');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.preHide, "alert('preHide');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postHide, "alert('postHide');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.preUpload, "alert('preUpload');");
FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postUpload, "alert('postUpload');");
} }