The goal of this section is to help you to gain comfort working with PHP File Uploader's JavaScript APIs.
1. Global Event Handlers
With the following global event handlers you can have multiple PHP File Uploader instances on the page where you can attach the same event handler to run the same code.
- For most functions, returning false would cancel the default action.
- Using 'this' you can get the uploader object.
Events | Description |
CuteWebUI_AjaxUploader_OnInitialize | Fires when an PHP File Uploader is fully initialized. |
CuteWebUI_AjaxUploader_OnStart | Fires when an upload of a specific file has started. |
CuteWebUI_AjaxUploader_OnStop | Fires when upload is stopped and not do postback. |
CuteWebUI_AjaxUploader_OnPostback | Fires before the page do PostBack to server side and fire the FileUploaded event. |
CuteWebUI_AjaxUploader_OnBrowse | Fires when the upload button is clicked. |
CuteWebUI_AjaxUploader_OnSelect | Fires when files are selected. |
CuteWebUI_AjaxUploader_OnProgress | Fires when new information about the upload progress for a specific file is available. |
CuteWebUI_AjaxUploader_OnQueueUI | Fires when the upload queue table is available. |
Example:
//Fires when an PHP File Uploader is fully initialized
function CuteWebUI_AjaxUploader_OnInitialize()
{
var hidden=this;
//warning , using the internalobject is not recommend .
//if you use it, you need test the uploader again for each new version.
var arr=[];
for(var p in hidden.internalobject)
{
arr.push(p);
}
alert("internal object member list : "+arr);
}
//Fires when an upload of a specific file has started
function CuteWebUI_AjaxUploader_OnStart()
{
var hidden=this;
hidden.internalobject.insertBtn.style.display='none'
}
//Fires when upload is stopped and not do postback
function CuteWebUI_AjaxUploader_OnStop()
{
var hidden=this;
hidden.internalobject.insertBtn.style.display=''
}
//Fires before the page do PostBack to server side and fire the FileUploaded event.
function CuteWebUI_AjaxUploader_OnPostback()
{
var hidden=this;
hidden.internalobject.insertBtn.style.display=''
//thie files are prepaired
//return false to cancel it..
}
//Fires when the upload button is clicked.
function CuteWebUI_AjaxUploader_OnBrowse()
{
//return false to cancel it..
}
//Fires when files are selected.
function CuteWebUI_AjaxUploader_OnSelect(files)
{
//change the files array would take no effect.
var name=files[0].FileName;
var size=files[0].FileSize // (or -1)
//return false to cancel it..
}
//Fires when new information about the upload progress for a specific file is available.
function CuteWebUI_AjaxUploader_OnProgress(enable,filename,begintime,uploadedsize,totalsize)
{
var hidden=this;
if(enable)
{
if(totalsize)
{
document.title=filename+" - "+Math.floor(100*uploadedsize/totalsize)+'%'
}
else
{
}
}
else
{
}
return false; //hide the default UI.
}
//Fires when the upload queue table is available.
function CuteWebUI_AjaxUploader_OnQueueUI(list)
{
var name=list[0].FileName
var size=list[0].FileSize // (or -1)
var stat=list[0].Status // Finish|Error|Upload|Queue
var func=list[0].Cancel;
//display the
//return false to hide the default queue table!
}
2. Instance Event Handler
With the following instance event handlers you can attach event handlers directly to an instance of PHP File Uploader by setting obj.handlexxxxx (lower case).
- For most functions, returning false would cancel the default action.
- Using 'this' you can get the uploader object.
Events | Description |
handleinitialize | Fires when an PHP File Uploader is fully initialized. |
handlestart | Fires when an upload of a specific file has started. |
handlestop | Fires when upload is stopped and not do postback. |
handlepostback | Fires before the page do PostBack to server side and fire the FileUploaded event. |
handlebrowse | Fires when the upload button is clicked. |
handleselect | Fires when files are selected. |
handleprogress | Fires when new information about the upload progress for a specific file is available. |
handlequeueui | Fires when the upload queue table is available. |
Example:
var hidden=document.getElementById('myuploader')
hidden.handlebrowse=function()
{
var checkbox=document.getElementById("agreecheckbox");
if(!checkbox.checked)
{
alert("you must agree the contract")
return false;
}
}