''FileBox'' Element

FileBox element is used to provide file upload functionality on pages. An user can select a file from his local computer and upload to a predefined location on the server computer.

When the user clicks on [Upload...] button, a file dialog is opened. The file uploading starts immediately after a file is chosen on the file dialog and [OK] button is clicked.

When upload is completed successfully the name of the file on the server is returned to the FileBox element. If, for any reason, the upload is not successful then the user is warned with a message window and null value is returned.

Note: The returned value is the pure name of the file with extension on the server; not the full path.

FileBox element acts as one single input element. The inner editbox element is not assigned a value individually. It is sufficient to name the FileBox element itself. This name is also used to as the name of the input parameter of the request.

If an extension list (items separated with ';' character) is defined in this property, the file selected through the browser's file dialog will be checked against it and the if the extension of the selected file is not in the list then uploading of it will not blocked.

It is possible to avoid uploading of the big files by defining a file size limit in kilobytes in this property. If a limit is defined then the upload service of the Filer component will check the size to uploaded bytes during the upload and if the limit is exceeded it will stop the upload and delete the current file on the server.

The name of the upload directory on the server computer. The definition can be absolute or relative to the root directory of the web application. If no value is given then the files are uploaded directly to the root directory of the web application.

If the file to be uploaded supposed to be temporary and be deleted after a certain time, then this property should be assigned
"WEB-INF-MM-INF/~tempfiles". MoreMotion scans this special directory all the time and deletes the expired files.

But that alone is not sufficient. MoreMotion scans only the files whose names have a value in YYYYMMDDHHMMSS pattern in their first 14 characters. If the time given in this 14 characters is already passed the file is deleted.

To organize the name of the file using this pattern easily, the "Name of the File on Server" property should be set to 2 or 3. This ensures that the file is named to be deleted after one hour.

The name of the file on the server is constructed according to value of this property. The choices are:

2.	Auto-generated The name of the server file will be an auto-generated name that has the extension of the local file.

3.	Auto-generated + Local File Name The name of the server file will be a combination of an auto-generated name and the local file name.

4.	Local File Name + Auto-generated The name of the server file will be a combination of the local file name and an auto-generated name.

If the file to upload already exists on the server the uploading is either canceled or the server file is overwritten with the new file depending on the value of this property. "True" means overwrite the existing file and "False" means cancel the upload.

In order to show to the user that the file uploading is in progress, a BusyImage element must be provided. Place a "mor > Ajax > BusyImage" element on to the page, assign an Id to its HTML Id property and write that Id to this property.

Alternatively you can specify '*' as a value. In this case the default BusyImage will be used and deploying an additional BusyImage element will not be necessary.

If a javascript function is defined in the current page and the of it is given into this property, it is called right after a file is selected through the browser's open file dialog. If the function returns false then the uploading of the file will be canceled.

function CheckFileName(fileName) {

// ...

if (...) {

alert("Invalid file!");

return false;

}

If there is a function that needs to be called after the upload is completed successfully then its name can be given into this property. The parameter passed will contain the name of the local file.

function SetImageSource(fbox) {

document.getElementById("logo_image").src = fbox.browserFileName;

}