Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
0655925
[update] grammar and style in Form Avatar
serhiipylypchuk1991 Sep 14, 2026
4575f38
[fix] wrong capabilities in Form Button description
serhiipylypchuk1991 Sep 14, 2026
03ed60c
[update] grammar and style in Form DatePicker
serhiipylypchuk1991 Sep 14, 2026
a948e7b
[update] grammar and style in Form Checkbox
serhiipylypchuk1991 Sep 14, 2026
599889c
[update] grammar and style in Form CheckboxGroup
serhiipylypchuk1991 Sep 14, 2026
10959c1
[update] grammar and style in Form ColorPicker
serhiipylypchuk1991 Sep 14, 2026
38e44eb
[update] grammar and style in Form Combo
serhiipylypchuk1991 Sep 14, 2026
0282296
[update] grammar and style in Form configuration
serhiipylypchuk1991 Sep 14, 2026
3245ec4
[update] grammar and style in Form Container
serhiipylypchuk1991 Sep 14, 2026
7305443
[update] grammar and style in Form customization
serhiipylypchuk1991 Sep 14, 2026
863b993
[fix] swapped control descriptions in Form features
serhiipylypchuk1991 Sep 14, 2026
4b5e579
[update] grammar and style in Form Fieldset
serhiipylypchuk1991 Sep 14, 2026
54a3706
[update] grammar and style in Form event handling
serhiipylypchuk1991 Sep 15, 2026
92d2887
[update] grammar and style in Form initialization
serhiipylypchuk1991 Sep 15, 2026
a5ebf1e
[update] grammar and style in Form overview
serhiipylypchuk1991 Sep 15, 2026
06a5e9d
[update] grammar and style in Form localization
serhiipylypchuk1991 Sep 15, 2026
e85615e
[update] grammar and style in Form RadioGroup
serhiipylypchuk1991 Sep 15, 2026
509dfcb
[update] grammar and style in Form Select
serhiipylypchuk1991 Sep 15, 2026
c2411b8
[update] grammar and style in Form SimpleVault
serhiipylypchuk1991 Sep 15, 2026
fcea161
[update] grammar and style in Form Slider
serhiipylypchuk1991 Sep 15, 2026
cff2dcb
[update] grammar and style in Form Spacer
serhiipylypchuk1991 Sep 15, 2026
6e84ccb
[update] grammar and style in Form Text
serhiipylypchuk1991 Sep 15, 2026
b9ac346
[update] grammar and style in Form Textarea
serhiipylypchuk1991 Sep 15, 2026
a1cc802
[update] grammar and style in Form TimePicker
serhiipylypchuk1991 Sep 15, 2026
8630097
[update] grammar and style in Form Toggle
serhiipylypchuk1991 Sep 15, 2026
d80e237
[update] grammar and style in Form ToggleGroup
serhiipylypchuk1991 Sep 15, 2026
8609d15
[fix] wrong API name and examples in Work with Form
serhiipylypchuk1991 Sep 15, 2026
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions docs/form/avatar.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ description: You can explore the Avatar of Form in the documentation of the DHTM

# Avatar

A compact but useful control for swift uploading of an avatar into a form.
A compact control for uploading an avatar to a form.

![Avatar form control with an empty photo placeholder and an Add a photo prompt in DHTMLX Suite](/img/form/form_avatar.png)

Expand All @@ -16,7 +16,7 @@ A compact but useful control for swift uploading of an avatar into a form.

## Adding Avatar

You can easily add an Avatar control during initialization of a form:
You can add an Avatar control during form initialization:

~~~js
const form = new dhx.Form("form_container", {
Expand All @@ -39,11 +39,11 @@ const form = new dhx.Form("form_container", {

### Properties

View [the full list of configuration properties of the Avatar control](form/api/avatar/api_avatar_properties.md).
View [the full list of Avatar configuration properties](form/api/avatar/api_avatar_properties.md).

## Working with Avatar

You can manipulate an Avatar control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage an Avatar control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

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

Expand All @@ -53,8 +53,8 @@ const value = form.getItem("avatar").getValue();

### Methods

Check [the full list of methods of the Avatar control](form/api/api_overview.md#avatar-methods).
Check [the full list of Avatar methods](form/api/api_overview.md#avatar-methods).

### Events

Check [the full list of events of the Avatar control](form/api/api_overview.md#avatar-events).
Check [the full list of Avatar events](form/api/api_overview.md#avatar-events).
14 changes: 7 additions & 7 deletions docs/form/button.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,15 @@ description: You can explore the Button of Form in the documentation of the DHTM

# Button

A simple button that can have an icon. Button can be *twoState* and can have a badge with a number, which can be useful for displaying the number of new messages, etc.
A simple button that can have an icon. A button can submit form data to a server.

![Button form control styled as a blue flat Send button in DHTMLX Suite](/img/form/form_button.png)

**Related sample**: [Form. All controls](https://snippet.dhtmlx.com/ikyyekxq)

## Adding Button

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

~~~js
const form = new dhx.Form("form_container", {
Expand All @@ -33,22 +33,22 @@ const form = new dhx.Form("form_container", {

### Properties

View [the full list of configuration properties of the Button control](form/api/button/api_button_properties.md).
View [the full list of Button configuration properties](form/api/button/api_button_properties.md).

## Working with Button

You can manipulate a Button control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage a Button control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

For example, you can disable a control on a page:
For example, you can disable the control:

~~~js
form.getItem("button").disable();
~~~

### Methods

Check [the full list of methods of the Button control](form/api/api_overview.md#button-methods).
Check [the full list of Button methods](form/api/api_overview.md#button-methods).

### Events

Check [the full list of events of the Button control](form/api/api_overview.md#button-events).
Check [the full list of Button events](form/api/api_overview.md#button-events).
20 changes: 10 additions & 10 deletions docs/form/calendar.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ description: You can explore the DatePicker of Form in the documentation of the

# DatePicker

An input with a calendar attached to it for selecting a date.
An input with an attached calendar for selecting a date.

![DatePicker form control with an open calendar for selecting a date in DHTMLX Suite](/img/form/form_datepicker.png)

Expand All @@ -16,7 +16,7 @@ An input with a calendar attached to it for selecting a date.

## Adding DatePicker

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

~~~js
const form = new dhx.Form("form_container", {
Expand All @@ -31,13 +31,13 @@ const form = new dhx.Form("form_container", {
});
~~~

## Properties
### Properties

View [the full list of configuration properties of the Datepicker control](form/api/calendar/api_calendar_properties.md).
View [the full list of DatePicker configuration properties](form/api/calendar/api_calendar_properties.md).

## Working with DatePicker

You can manipulate a DatePicker control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage a DatePicker control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

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

Expand All @@ -51,17 +51,17 @@ const value = form.getItem("datepicker").getValue(true);

### Methods

Check [the full list of methods of the Datepicker control](form/api/api_overview.md#datepicker-methods).
Check [the full list of DatePicker methods](form/api/api_overview.md#datepicker-methods).

### Events

Check [the full list of events of the Datepicker control](form/api/api_overview.md#datepicker-events).
Check [the full list of DatePicker events](form/api/api_overview.md#datepicker-events).

## Working with the dhtmlxCalendar widget

There is a possibility to use methods of DHTMLX Calendar via the [getWidget()](form/api/calendar/calendar_getwidget_method.md) method of a DatePicker control.
You can use DHTMLX Calendar methods with the [`getWidget()`](form/api/calendar/calendar_getwidget_method.md) method of a DatePicker control.

For example, you can show the current month in the control. To do this, you need to get the widget attached to the DatePicker control and then use the [showDate()](calendar/api/calendar_showdate_method.md) method of this widget.
For example, to show the current month in the control, get the widget attached to the DatePicker control and call its [`showDate()`](calendar/api/calendar_showdate_method.md) method.

~~~js
const datepicker = form.getItem("datepicker").getWidget(); // -> DHTMLX Calendar
Expand All @@ -70,4 +70,4 @@ datepicker.showDate(null,"month"); // shows the current month

**Related sample**: [Form. Get widget of control](https://snippet.dhtmlx.com/0aqkdsi7)

Check [the full list of methods of the DHTMLX Calendar component](calendar/api/api_overview.md#methods) which you can apply via the [getWidget()](form/api/calendar/calendar_getwidget_method.md) method.
Check [the full list of DHTMLX Calendar methods](calendar/api/api_overview.md#methods) that you can apply with the [`getWidget()`](form/api/calendar/calendar_getwidget_method.md) method.
14 changes: 7 additions & 7 deletions docs/form/checkbox.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ description: You can explore the Checkbox of Form in the documentation of the DH

# Checkbox

A control that allows displaying the specified value or change it to the opposite one.
A control that displays the specified value and allows you to switch it to the opposite one.

![Checkbox form control shown in unchecked and checked states in DHTMLX Suite](/img/form/form_checkbox.png)

Expand All @@ -16,7 +16,7 @@ A control that allows displaying the specified value or change it to the opposit

## Adding Checkbox

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

~~~js
const form = new dhx.Form("form_container", {
Expand All @@ -34,22 +34,22 @@ const form = new dhx.Form("form_container", {

### Properties

View [the full list of configuration properties of the Checkbox control](form/api/checkbox/api_checkbox_properties.md).
View [the full list of Checkbox configuration properties](form/api/checkbox/api_checkbox_properties.md).

## Working with Checkbox

You can manipulate a Checkbox control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage a Checkbox control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

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

~~~js
const value = form.getItem("checkbox").getValue();
const value = form.getItem("agree").getValue();
~~~

### Methods

Check [the full list of methods of the Checkbox control](form/api/api_overview.md#checkbox-methods).
Check [the full list of Checkbox methods](form/api/api_overview.md#checkbox-methods).

### Events

Check [the full list of events of the Checkbox control](form/api/api_overview.md#checkbox-events).
Check [the full list of Checkbox events](form/api/api_overview.md#checkbox-events).
20 changes: 10 additions & 10 deletions docs/form/checkboxgroup.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,15 @@ description: You can explore the CheckboxGroup of Form in the documentation of t

# CheckboxGroup

A control intended for creating groups of checkboxes.
A control that groups checkboxes.

![CheckboxGroup form control with three checkbox options and the first one checked in DHTMLX Suite](/img/form/form_checkboxgroup.png)

**Related sample**: [Form. Checkbox groups](https://snippet.dhtmlx.com/p89u4ovb?tag=checkbox_group)

## Adding CheckboxGroup

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

~~~js
const form = new dhx.Form("form_container", {
Expand Down Expand Up @@ -55,26 +55,26 @@ const form = new dhx.Form("form_container", {

### Properties of CheckboxGroup

View [the full list of configuration properties of the CheckboxGroup control](form/api/checkbox_group/api_checkboxgroup_properties.md).
View [the full list of CheckboxGroup configuration properties](form/api/checkbox_group/api_checkboxgroup_properties.md).

### Properties of Checkbox of CheckboxGroup control
### Properties of a Checkbox in CheckboxGroup

Check [the full list of configuration properties of a Checkbox of the CheckboxGroup control](form/api/checkbox_group/api_checkboxgroup_properties.md#properties-of-a-checkbox-of-checkboxgroup).
View [the full list of configuration properties for a Checkbox in CheckboxGroup](form/api/checkbox_group/api_checkboxgroup_properties.md#properties-of-a-checkbox-of-checkboxgroup).

## Working with CheckboxGroup

You can manipulate a CheckboxGroup control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage a CheckboxGroup control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

For example, you can hide a control on a page:
For example, you can hide the control:

~~~js
const value = form.getItem("CheckboxGroup").hide();
form.getItem("checkboxGroup").hide();
~~~

### Methods

Check [the full list of methods of the CheckboxGroup control](form/api/api_overview.md#checkboxgroup-methods).
Check [the full list of CheckboxGroup methods](form/api/api_overview.md#checkboxgroup-methods).

### Events

Check [the full list of events of the CheckboxGroup control](form/api/api_overview.md#checkboxgroup-events).
Check [the full list of CheckboxGroup events](form/api/api_overview.md#checkboxgroup-events).
19 changes: 9 additions & 10 deletions docs/form/colorpicker.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ description: You can explore the ColorPicker of Form in the documentation of the

# ColorPicker

An input with a color picker attached to it for selecting a color.
An input with an attached color picker for selecting a color.

![ColorPicker form control with an open color palette and a hex value input in DHTMLX Suite](/img/form/form_colorpicker.png)

Expand All @@ -16,7 +16,7 @@ An input with a color picker attached to it for selecting a color.

## Adding ColorPicker

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

~~~js
const form = new dhx.Form("form_container", {
Expand All @@ -33,11 +33,11 @@ const form = new dhx.Form("form_container", {

### Properties

View [the full list of configuration properties of the Colorpicker control](form/api/colorpicker/api_colorpicker_properties.md).
View [the full list of ColorPicker configuration properties](form/api/colorpicker/api_colorpicker_properties.md).

## Working with ColorPicker

You can manipulate a ColorPicker control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage a ColorPicker control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

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

Expand All @@ -49,17 +49,17 @@ const value = form.getItem("colorpicker").getValue();

### Methods

Check [the full list of methods of the ColorPicker control](form/api/api_overview.md#color-picker-methods).
Check [the full list of ColorPicker methods](form/api/api_overview.md#color-picker-methods).

### Events

Check [the full list of events of the ColorPicker control](form/api/api_overview.md#color-picker-events).
Check [the full list of ColorPicker events](form/api/api_overview.md#color-picker-events).

## Working with the dhtmlxColorPicker widget

There is a possibility to use methods of DHTMLX ColorPicker via the [getWidget()](form/api/colorpicker/colorpicker_getwidget_method.md) method of a ColorPicker control.
You can use DHTMLX ColorPicker methods with the [`getWidget()`](form/api/colorpicker/colorpicker_getwidget_method.md) method of a ColorPicker control.

For example, you can set focus on the specified value in the control. To do this, you need to get the widget attached to the ColorPicker control and then use the [setFocus()](colorpicker/api/colorpicker_setfocus_method.md) method of this widget.
For example, to set focus on the specified value in the control, get the widget attached to the ColorPicker control and call its [`setFocus()`](colorpicker/api/colorpicker_setfocus_method.md) method.

~~~js
const colorpicker = form.getItem("colorpicker").getWidget(); // -> ColorPicker
Expand All @@ -68,5 +68,4 @@ colorpicker.setFocus("#BDF0E9"); // sets focus on the "#BDF0E9" color

**Related sample**: [Form. Get widget of control](https://snippet.dhtmlx.com/0aqkdsi7)


Check [the full list of methods of the DHTMLX Colorpicker component](colorpicker/api/api_overview.md#methods) which you can apply via the [getWidget()](form/api/colorpicker/colorpicker_getwidget_method.md) method.
Check [the full list of DHTMLX ColorPicker methods](colorpicker/api/api_overview.md#methods) that you can apply with the [`getWidget()`](form/api/colorpicker/colorpicker_getwidget_method.md) method.
20 changes: 10 additions & 10 deletions docs/form/combo.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ description: You can explore the Combo of Form in the documentation of the DHTML

# Combo

An input that represents an advanced select box with a set of options. It is able to provide suggestions while a user is typing text.
An input that works as an advanced select box with a set of options. It can show suggestions while the user types.

![Combo form control with an open dropdown list of numeric options in DHTMLX Suite](/img/form/form_combo.png)

Expand All @@ -16,7 +16,7 @@ An input that represents an advanced select box with a set of options. It is abl

## Adding Combo

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

~~~js
const form = new dhx.Form("form_container", {
Expand Down Expand Up @@ -46,35 +46,35 @@ const form = new dhx.Form("form_container", {

### Properties

View [the full list of configuration properties of the Combo control](form/api/combo/api_combo_properties.md).
View [the full list of Combo configuration properties](form/api/combo/api_combo_properties.md).

## Working with Combo

You can manipulate a Combo control by using methods or events of the object returned by the [getItem()](form/api/form_getitem_method.md) method.
You can manage a Combo control with the methods and events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns.

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

~~~js
const value = form.getItem("Combo").getValue();
const value = form.getItem("combo").getValue();
~~~

### Methods

Check [the full list of methods of the Combo control](form/api/api_overview.md#combo-methods).
Check [the full list of Combo methods](form/api/api_overview.md#combo-methods).

### Events

Check [the full list of events of the Combo control](form/api/api_overview.md#combo-events).
Check [the full list of Combo events](form/api/api_overview.md#combo-events).

### Working with the dhtmlxComboBox widget

There is a possibility to use methods of DHTMLX Combobox via the [getWidget()](form/api/combo/combo_getwidget_method.md) method of a Combo control.
You can use DHTMLX Combobox methods with the [`getWidget()`](form/api/combo/combo_getwidget_method.md) method of a Combo control.

For example, you can set focus in the Combo input without opening a popup with options. To do this, you need to get the widget attached to the Combo control and then use the [focus()](combobox/api/combobox_focus_method.md) method of this widget.
For example, to set focus in the Combo input without opening a popup with options, get the widget attached to the Combo control and call its [`focus()`](combobox/api/combobox_focus_method.md) method.

~~~js
const combo = form.getItem("combo").getWidget(); // -> ComboBox
combo.focus(); // sets focus in the input
~~~

Check [the full list of methods of the DHTMLX Combobox component](combobox/api/api_overview.md#methods) which you can apply via the [getWidget()](form/api/combo/combo_getwidget_method.md) method.
Check [the full list of DHTMLX Combobox methods](combobox/api/api_overview.md#methods) that you can apply with the [`getWidget()`](form/api/combo/combo_getwidget_method.md) method.
Loading