Select

An advanced select box that provides a set of options to choose from.

Select control

Related sample:  Form. All DhxForm Inputs

Related sample:  Form. Select

Adding Select

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

var form = new dhx.Form("form_container", {
    rows: [
        {
            type: "select",
            name: "select",
            label: "select",
            labelWidth: "50px",
            width:"200px",
            options: [
                {
                    value: "1",
                    content: "1",
                    disabled: true
                },
                {
                    value: "2",
                    content: "2"
                },
                {
                    value: "3",
                    content: "3"
                },
                {
                    value: "4",
                    content: "4"
                }
            ]        
        }  
    ]
});

Attributes

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

Working with Select

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

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

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

List of the control methods:

clear clears a value of a Select control
clearValidate clears validation of a Select control
disable disables a Select control on a page
enable enables a disabled Select control
focus sets focus to a control
getOptions returns an array of Select options
getProperties returns an object with the available configuration attributes of the control
getValue returns the current value of a Select control
hide hides a Select control
isDisabled checks whether a Select control is disabled
isVisible checks whether a Select control is visible on the page
setOptions allows changing a list of Select options dynamically
setProperties allows changing available configuration attributes of the control dynamically
setValue sets the value for a Select control
show shows a Select control on the page
validate validates a Select 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
beforeValidate fires before the control value is validated
change fires on changing the value of a control
changeOptions fires on changing a list of Select options
Back to top