Skip to main content

getProperties()

returns an object with the available configuration attributes of the control

getProperties(): IDatePickerProps;

Returns:

An object with the available attributes of the control and their values.

Example

const form = new dhx.Form("form_container", {
    rows: [
        {
            type: "datepicker",
            name: "datepicker",
            label: "date",
            labelWidth: "50px"
        }
    ]
});

form.getItem("datepicker").getProperties();

// -> the returned object:
{
    dateFormat: "%d/%m/%y",
    disabledDates: undefined,
    editable: false,
    errorMessage: "",
    height: "content",
    helpMessage: "",
    hiddenLabel: false,
    icon: "",
    label: "date",
    labelPosition: "top",
    labelWidth: "50px",
    mark: undefined,
    mode: "calendar",
    padding: 0,
    placeholder: "",
    preMessage: "",
    required: false,
    successMessage: "",
    thisMonthOnly: false,
    timeFormat: 24,
    timePicker: false,
    validation: undefined,
    valueFormat: "string",
    weekNumbers: false,
    weekStart: "sunday",
    width: "content"
}

The returned object of the DatePicker control can contain the following configuration attributes:

valueFormat(string) defines the format of the value that will be returned while getting the current value of the control: "string" (default) or "Date"
width(string|number|"content") the width of a control
height(string|number|"content") the height of a control
padding(string|number) sets padding between a cell and a border of a DatePicker control
required(boolean) defines whether a control is required
helpMessage(string) adds a help message to a control
preMessage(string) a message that contains instructions for interacting with the control
successMessage(string) a message that appears in case of successful validation of the control value
errorMessage(string) a message that appears in case of error during validation of the control value
label(string) specifies a label for a control
labelWidth(string|number) sets the width of the label of a control
hiddenLabel(boolean) invisible label that will be used to identify the input on the server side
labelPosition(string) defines the position of a label: "left"|"top"
validation(function) the validation function, takes as a parameter the value to validate and returns true/false to indicate the result of validation
icon(string) the name of an icon from the used icon font
placeholder(string) a tip for the input
editable(boolean) allows a user to enter the value of the control manually, false by default
mode(string) specifies the mode of displaying a calendar: "calendar" (default), "month", "year"
mark(function) adds a CSS class to specific days
disabledDates(function) allows disabling some date intervals, day labels are dimmed
weekStart(string) sets the starting day of the week: "monday" or "sunday" (default)
weekNumbers(boolean) defines whether to show the numbers of weeks, false by default
timePicker(boolean) adds a timepicker into a calendar, false by default
timeFormat(number) defines the time format of a timepicker: 12-hour or 24-hour (12 or 24 (default), correspondingly)
dateFormat(string) defines the format of dates in the calendar, "%d/%m/%y" by default
thisMonthOnly(boolean) hides dates of the previous/next months relative to the currently displayed one

Change log:

added in v7.0