SimpleVault

A handy control for quick and easy uploading of a file or a set of files.

SimpleVault control

Related sample:  Form. All DhxForm Inputs

Related sample:  Form. Simple Vault

Adding SimpleVault

You can easily add a SimpleVault control during initialization of a form:

var form = new dhx.Form("form_container", {
    rows: [
        {
            type: "simpleVault",
            name:"simplevault",
            label: "i am simpleVault",
            labelWidth: "120px",
            labelPosition: "left",
            disabled: false,
            required: false
        }
    ]
});

Attributes

You can provide the following attributes in the configuration object of a SimpleVault:

Working with SimpleVault

You can manipulate a SimpleVault control by using methods (events) of the object returned by the getItem() method.

For example, you can get the value of the control:

var value = form.getItem("simpleVault").getValue();

List of the control methods:

clear clears a value of a SimpleVault control
clearValidate clears validation of a SimpleVault control
disable disables a SimpleVault control on a page
enable enables a disabled SimpleVault control
getProperties returns an object with the available configuration attributes of the control
getValue returns the current value of a SimpleVault control
hide hides a SimpleVault control
isDisabled checks whether a SimpleVault control is disabled
isVisible checks whether a SimpleVault control is visible on the page
selectFile opens the dialog for selecting a new file (files) for adding to a SimpleVault
send sends a POST request for file upload to a server-side URL
setProperties allows changing available configuration attributes of the control dynamically
setValue sets the value for a SimpleVault control
show shows a SimpleVault control on the page
validate validates a SimpleVault control

List of the control events:

afterChangeProperties fires after configuration attributes of the control have been changed dynamically
afterHide fires after a control is hidden
afterShow fires after a control is shown
afterValidate fires after the control value is validated
beforeChangeProperties fires before configuration attributes of the control are changed dynamically
beforeHide fires before a control is hidden
beforeShow fires before a control is shown
beforeUploadFile fires before file upload begins
beforeValidate fires before the control value is validated
change fires on changing the value of a control
uploadBegin fires when file upload begins
uploadComplete fires when upload is completed
uploadFail fires if the file upload failed
uploadFile fires when a file has been uploaded
uploadProgress fires on each percent of files uploading

Using DataCollection API

You can manipulate a SimpleVault control with the help of the DataCollection API.

For example, you can remove one or all files from the list. To do that, you need to apply the remove, or removeAll method of DataCollection to the object returned by the getItem() method as follows:

form.getItem("simpleVault").data.remove("file_id");
 
form.getItem("simpleVault").data.removeAll();

Check the full list of Data Collection API.

Uploading files

You can read about uploading files into a SimpleVault control in the related article.

Back to top