From 06559257e0054205543e65ae209ce551fef58eae Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 09:58:28 +0300 Subject: [PATCH 01/27] [update] grammar and style in Form Avatar - the opening line read "A compact but useful control for swift uploading of an avatar into a form": the but-useful contrast implies compact things usually are not, "swift" says nothing, the preposition was wrong and "uploading of" is a gerund noun. The noun-phrase form is kept, it is the house style across all 19 control pages - dropped "easily", "initialization of a form" -> "form initialization" - "manipulate an Avatar control by using methods or events of the object returned by the getItem() method" carried a by-ing link, a loose verb and a passive participle; the method name in the link label got backticks - three link labels said "the full list of X of the Avatar control", now "Avatar configuration properties", "Avatar methods", "Avatar events" Checked and deliberately left alone: View for properties and Check for methods/events looked like an inconsistency but is the site convention, 19 occurrences of each across docs/form/. The "manipulate a X control by using methods or events of the object returned by getItem()" sentence is repeated verbatim in 19 files under docs/form/, along with the "full list of ... of the ... control" labels. Fixed here only, as with the earlier shared boilerplate. --- docs/form/avatar.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/form/avatar.md b/docs/form/avatar.md index 5a5103c5..3d7b7265 100644 --- a/docs/form/avatar.md +++ b/docs/form/avatar.md @@ -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) @@ -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", { @@ -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: @@ -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). \ No newline at end of file +Check [the full list of Avatar events](form/api/api_overview.md#avatar-events). \ No newline at end of file From 4575f3815fe5084d071201d04c7166b08bf12b02 Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 10:28:56 +0300 Subject: [PATCH 02/27] [fix] wrong capabilities in Form Button description The opening line claimed the Form Button "can be twoState and can have a badge with a number". Neither exists on this control: - twoState appears nowhere in the Form Button properties; across the docs it belongs to Sidebar navItem and Toolbar only - the control has no count or countColor property, so no badge. Sidebar navItem does, documented as "a badge with a number" The sentence was copied from toolbar/button.md:9, where both are real, and "two states" was even turned into the property name twoState on the way. Replaced with submit, which the properties table documents along with url and its own related sample. Grammar and style in the same pass: - dropped the etc. that ended the sentence and the *twoState* italics - "You can easily add a Button control during initialization of a form" -> "during form initialization" - "manipulate a Button control by using methods or events of the object returned by the getItem() method" carried a by-ing link, a loose verb and a passive participle; the method name in the link label got backticks - three link labels said "the full list of X of the Button control", now "Button configuration properties", "Button methods", "Button events" - "disable a control on a page" -> "disable the control" View for properties and Check for methods/events are left as they are, that split is the site convention rather than an inconsistency. The shared "manipulate a X control by using..." sentence and the "full list of ... of the ... control" labels remain in 18 other docs/form/ files, fixed here only as agreed. --- docs/form/button.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/docs/form/button.md b/docs/form/button.md index 344cbc1b..b494a8bf 100644 --- a/docs/form/button.md +++ b/docs/form/button.md @@ -6,7 +6,7 @@ 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) @@ -14,7 +14,7 @@ A simple button that can have an icon. Button can be *twoState* and can have a b ## 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", { @@ -33,13 +33,13 @@ 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(); @@ -47,8 +47,8 @@ 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). From 03ed60ce3ae6eea9dc50c7135d6746b8275cc6ef Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 10:44:33 +0300 Subject: [PATCH 03/27] [update] grammar and style in Form DatePicker - "## Properties" sat at the same level as "## Adding DatePicker" while Methods and Events in the same file were "###". Sibling pages use "### Properties" 16 times against 2, nothing links to the #properties anchor and the slug is unchanged, so it is "###" now - the control was called DatePicker 12 times and Datepicker 3 times, in the properties, methods and events link labels - "There is a possibility to use methods of DHTMLX Calendar via the getWidget() method" carried a weak opener, via and an of-chain - "For example, you can show the current month in the control. To do this, you need to get the widget..." merged into one sentence without the modal padding - "the full list of methods of the DHTMLX Calendar component which you can apply via the getWidget() method": restrictive which -> that, via -> with, of-chain removed from the label - "You can easily add a DatePicker control during initialization of a form" -> "during form initialization" - "manipulate a DatePicker control by using methods or events of the object returned by the getItem() method" rewritten, and getItem(), getWidget() and showDate() got backticks in their link labels - three labels said "the full list of X of the Datepicker control", now "DatePicker configuration properties", "DatePicker methods", "DatePicker events" - "a calendar attached to it" -> "an attached calendar" Headings "Working with DatePicker" and "Working with the dhtmlxCalendar widget" are untouched: whatsnew.md:3033-3035 and form/features.md:121 link to their anchors, so the legacy dhtmlxCalendar spelling stays in the heading even though the body says DHTMLX Calendar. Noticed in passing, not changed: the getValue sample declares const value twice in the same scope, so it would not run as written. --- docs/form/calendar.md | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/docs/form/calendar.md b/docs/form/calendar.md index 7d542721..1d257c8d 100644 --- a/docs/form/calendar.md +++ b/docs/form/calendar.md @@ -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) @@ -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", { @@ -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: @@ -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 @@ -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. \ No newline at end of file +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. \ No newline at end of file From a948e7b06b07e11d47f232c48125b5634a6ab318 Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 11:10:54 +0300 Subject: [PATCH 04/27] [update] grammar and style in Form Checkbox - the opening line mixed a gerund and a bare infinitive in one series: "allows displaying the specified value or change it". Rewritten as "displays the specified value and allows you to switch it", which also drops the allows-ing form - the two samples disagreed: the first sets id "agree", the second called form.getItem("checkbox"). Sibling pages (input, select, textarea) always pass the id their own sample defines, so this is now getItem("agree") - "You can easily add a Checkbox control during initialization of a form" -> "during form initialization" - "manipulate a Checkbox control by using methods or events of the object returned by the getItem() method" carried a by-ing link, a loose verb and a passive participle; the method name in the link label got backticks - three labels said "the full list of X of the Checkbox control", now "Checkbox configuration properties", "Checkbox methods", "Checkbox events" Heading levels were already correct here, unlike calendar.md. View for properties and Check for methods/events stay as they are, that split is the site convention. The shared boilerplate remains in 17 other docs/form/ files. --- docs/form/checkbox.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/docs/form/checkbox.md b/docs/form/checkbox.md index 06a5e660..ebb33f62 100644 --- a/docs/form/checkbox.md +++ b/docs/form/checkbox.md @@ -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) @@ -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", { @@ -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). From 599889c1a1ce9ea7df1f7141d2de7746216602bc Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 11:34:04 +0300 Subject: [PATCH 05/27] [update] grammar and style in Form CheckboxGroup - the sample called form.getItem("CheckboxGroup") while the config above it sets id "checkboxGroup"; case matters, so the call would not find the control - that same line assigned hide() to a const named value, though hide() returns nothing and the action is not about a value. The assignment is gone - line 62 opened with "Check [the full list of configuration properties...", the only such occurrence in docs/form/; the other 15 use View. Changed to View - the heading "Properties of Checkbox of CheckboxGroup control" stacked two of-phrases. Nothing links to its anchor, features.md only uses #working-with-checkboxgroup, so it is now "Properties of a Checkbox in CheckboxGroup" - "A control intended for creating groups of checkboxes" -> "A control that groups checkboxes", keeping the noun-phrase blurb style - "You can easily add a CheckboxGroup control during initialization of a form" -> "during form initialization" - "manipulate a CheckboxGroup control by using methods or events of the object returned by the getItem() method" rewritten, and the method name in the link label got backticks - four link labels carried of-chains: "configuration properties of a Checkbox of the CheckboxGroup control" -> "for a Checkbox in CheckboxGroup", plus CheckboxGroup configuration properties, methods and events - "hide a control on a page" -> "hide the control" The shared boilerplate remains in 16 other docs/form/ files. --- docs/form/checkboxgroup.md | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/docs/form/checkboxgroup.md b/docs/form/checkboxgroup.md index e9703282..5e0538a1 100644 --- a/docs/form/checkboxgroup.md +++ b/docs/form/checkboxgroup.md @@ -6,7 +6,7 @@ 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) @@ -14,7 +14,7 @@ A control intended for creating groups of checkboxes. ## 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", { @@ -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). From 10959c127afba695ba40353d164d565e8a0a0229 Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 11:52:15 +0300 Subject: [PATCH 06/27] [update] grammar and style in Form ColorPicker Same defect set as calendar.md, the two pages are structurally identical. - Colorpicker appeared in two link labels against 16 uses of ColorPicker - "There is a possibility to use methods of DHTMLX ColorPicker via the getWidget() method" carried a weak opener, via and an of-chain - "For example, you can set focus... To do this, you need to get the widget..." merged into one sentence without the modal padding - "the full list of methods of the DHTMLX Colorpicker component which you can apply via the getWidget() method": restrictive which -> that, via -> with, of-chain removed from the label - "You can easily add a ColorPicker control during initialization of a form" -> "during form initialization" - "manipulate a ColorPicker control by using methods or events of the object returned by the getItem() method" rewritten, and getItem(), getWidget() and setFocus() got backticks in their link labels - three labels said "the full list of X of the ColorPicker control", now "ColorPicker configuration properties", "ColorPicker methods", "ColorPicker events" - "a color picker attached to it" -> "an attached color picker" - removed a stray blank line before the closing paragraph Headings are untouched: whatsnew.md:3035 and form/features.md:121 link to #working-with-colorpicker and #working-with-the-dhtmlxcolorpicker-widget, so the legacy dhtmlxColorPicker spelling stays in the heading. Unlike checkbox.md and checkboxgroup.md, getItem("colorpicker") here matches the name in the sample above it. --- docs/form/colorpicker.md | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/docs/form/colorpicker.md b/docs/form/colorpicker.md index bb528996..514dd601 100644 --- a/docs/form/colorpicker.md +++ b/docs/form/colorpicker.md @@ -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) @@ -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", { @@ -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: @@ -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 @@ -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. \ No newline at end of file +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. \ No newline at end of file From 38e44ebaf5e28022cfc6b02cc13372c2ff6ff05f Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 12:44:55 +0300 Subject: [PATCH 07/27] [update] grammar and style in Form Combo - the getValue sample called form.getItem("Combo") while the config sets name "combo" and the widget sample three lines below uses getItem("combo"). Case matters, and the page contradicted itself - "An input that represents an advanced select box" -> "works as", per the misused-words rule - "It is able to provide suggestions while a user is typing text" -> "It can show suggestions while the user types": padded modal, the overused provide, and present continuous - "There is a possibility to use methods of DHTMLX Combobox via the getWidget() method" carried a weak opener, via and an of-chain - "For example, you can set focus... To do this, you need to get the widget..." merged into one sentence without the modal padding - "the full list of methods of the DHTMLX Combobox component which you can apply via the getWidget() method": restrictive which -> that, via -> with, of-chain removed from the label - "You can easily add a Combo control during initialization of a form" -> "during form initialization" - "manipulate a Combo control by using methods or events of the object returned by the getItem() method" rewritten, and getItem(), getWidget() and focus() got backticks in their link labels - three labels said "the full list of X of the Combo control", now "Combo configuration properties", "Combo methods", "Combo events" Checked and left alone: the "### Working with the dhtmlxComboBox widget" heading level. Siblings are split, ## in calendar.md and colorpicker.md against ### in combo.md, timepicker.md and slider.md, so neither is the convention. The heading text is an anchor target from whatsnew.md:1824. --- docs/form/combo.md | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/docs/form/combo.md b/docs/form/combo.md index 892bf494..7914ae14 100644 --- a/docs/form/combo.md +++ b/docs/form/combo.md @@ -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) @@ -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", { @@ -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. \ No newline at end of file +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. \ No newline at end of file From 028229657a00991aabcf74553c6e57f59b7c8ead Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 13:23:49 +0300 Subject: [PATCH 08/27] [update] grammar and style in Form configuration - "Grouping Controls in Form" was the only Title Case heading of the seven on this page. Slugs are lowercased, so the anchor #grouping-controls-in-form is unchanged and the 7 links to it from features.md, form_cols_config.md, form_rows_config.md and this page still resolve - "set aligning direction" used a gerund as a modifier and dropped the article; "generate space" and "adjust sizes of a control group" reworded - two by-ing links removed: "apply ... by specifying the property" split into two sentences, "combine controls by placing controls" no longer repeats controls and loses the "To do this" bridge - "By default, Form is enabled/visible" replaced with the adjective form the rule asks for, and "make Form disabled/hidden" -> "disable Form" / "hide Form" - true moved from italics to backticks, twice - make use of -> use, with the help of -> with - the padding section called it a "parameter" while the other six sections say "property" - "with the corresponding properties [height] and [width]" reordered, dropping the vague "corresponding" - "various options of alignment for different control groups" carried both various and different plus an of-chain - "in the configuration object of the component" -> "in the component configuration object" - "with any level of complexity" -> "of nesting", which is what is actually being measured - removed a trailing space Noticed but out of scope: line 55 says "**Related Sample**:" with a capital S while line 57 says "**Related sample**:". The skill excludes those template lines from review. --- docs/form/configuration.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/form/configuration.md b/docs/form/configuration.md index 4253330f..1e3ea631 100644 --- a/docs/form/configuration.md +++ b/docs/form/configuration.md @@ -8,9 +8,9 @@ description: You can explore the configuration of Form in the documentation of t ## Alignment -The [](form/api/form_align_config.md) property allows you to set aligning direction for all controls in Form. +The [](form/api/form_align_config.md) property allows you to set the alignment direction for all controls in Form. -You can apply various options of alignment for different [control groups](form/configuration.md#grouping-controls-in-form) by specifying the [](form/api/form_align_config.md) property for the [](form/api/form_rows_config.md) and [](form/api/form_cols_config.md): +You can also apply different alignment options to separate [control groups](form/configuration.md#grouping-controls-in-form). Specify the [](form/api/form_align_config.md) property for the [](form/api/form_rows_config.md) and [](form/api/form_cols_config.md) properties: ~~~js const form = new dhx.Form("form_container", { @@ -56,9 +56,9 @@ const form = new dhx.Form("form_container", { **Related sample**: [Form. Change Form configuration](https://snippet.dhtmlx.com/1pzybtja) -## Grouping Controls in Form +## Grouping controls in Form -You can combine controls into groups by placing controls into rows and columns with any level of complexity. To do this, use the [](form/api/form_rows_config.md) and [](form/api/form_cols_config.md) options in the configuration object of the component: +You can combine controls into groups and place them into rows and columns with any level of nesting. Use the [](form/api/form_rows_config.md) and [](form/api/form_cols_config.md) options in the component configuration object: ~~~js {3,6,12,19,43,50} const form = new dhx.Form("form_container", { @@ -143,7 +143,7 @@ const form = new dhx.Form("form_container", { **Related sample**: [Form. Disabled](https://snippet.dhtmlx.com/7qjwg2sw) -By default, Form is enabled. To make Form disabled, set the [](form/api/form_disabled_config.md) configuration property to *true*: +The default Form state is enabled. To disable Form, set the [](form/api/form_disabled_config.md) configuration property to `true`: ~~~js const form = new dhx.Form("form_container", { @@ -154,7 +154,7 @@ const form = new dhx.Form("form_container", { ## Making Form hidden -By default, Form is visible. To make Form hidden, set the [](form/api/form_hidden_config.md) configuration property to *true*: +The default Form state is visible. To hide Form, set the [](form/api/form_hidden_config.md) configuration property to `true`: ~~~js const form = new dhx.Form("form_container", { @@ -165,7 +165,7 @@ const form = new dhx.Form("form_container", { ## Padding -To generate space around a [control group](form/configuration.md#grouping-controls-in-form), make use of the [](form/api/form_padding_config.md) parameter: +To add space around a [control group](form/configuration.md#grouping-controls-in-form), use the [](form/api/form_padding_config.md) property: ~~~js const form = new dhx.Form("form_container", { @@ -198,7 +198,7 @@ const form = new dhx.Form("form_container", { ## Title -You can define a title for a [control group](form/configuration.md#grouping-controls-in-form) with the help of the [](form/api/form_title_config.md) property: +You can define a title for a [control group](form/configuration.md#grouping-controls-in-form) with the [](form/api/form_title_config.md) property: ~~~js const form = new dhx.Form("form_container", { @@ -229,7 +229,7 @@ const form = new dhx.Form("form_container", { ## Width/Height -You can adjust sizes of a [control group](form/configuration.md#grouping-controls-in-form) with the corresponding properties [](form/api/form_height_config.md) and [](form/api/form_width_config.md): +You can adjust the size of a [control group](form/configuration.md#grouping-controls-in-form) with the [](form/api/form_height_config.md) and [](form/api/form_width_config.md) properties: ~~~js const form = new dhx.Form("form_container", { From 3245ec42ef2bcdd2be44585ca2c53be873bf6653 Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 14:34:43 +0300 Subject: [PATCH 09/27] [update] grammar and style in Form Container - replaced the legacy {{pronote}} macro with a :::info admonition, it was rendering literally on the page - "The list of the properties is used to configure the Container control" credited the list rather than the properties, and was passive. css, height, width and padding are real Container properties per api_container_properties.md, so they are in backticks now - dropped etc. twice; on line 44 it followed "For example", which the abbreviations rule calls redundant - trimmed the marketing: "a very convenient way", "to make the project functional and easy to use" - "You can add the Container control to the Form in an easy way" said nothing the next sentence did not, merged into it - "You need to specify the type of the control `type: "container"`" was an apposition without punctuation plus a modal, now "set `type: "container"`" - "You cannot attach Layout and Form widgets" was tacked onto the end of a promotional paragraph; it stands on its own now - fixed articles: "the DHTMLX widgets", "attach the HTML code", "for DHTMLX widget" - "during the initialization of Form" -> "during Form initialization" - "manipulate the Container control by using methods/events of the object returned by the getItem() method" in both sections, with getItem() gaining backticks in the labels - "List of the Container control methods/events/properties" -> "List of Container methods/events/properties" - hyphen separators in the list -> em dashes, and the stranded "Look at the sample above" joined to its sentence The ## Methods heading is untouched, features.md:121 links to its anchor. {{pronote}} still stands in 6 other files: pagination/index.md, list/load_data.md, helpers/lazydataproxy.md, helpers/datadrivers.md, helpers/custom_scroll.md and grid/data_loading.md. --- docs/form/container.md | 32 +++++++++++++++++--------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/docs/form/container.md b/docs/form/container.md index 08485762..72789ef0 100644 --- a/docs/form/container.md +++ b/docs/form/container.md @@ -6,39 +6,41 @@ description: You can explore the Container of Form in the documentation of the D # Container -{{pronote The Container control is available in the PRO version only.}} +:::info +The Container control is available in the PRO version only. +::: -A control to attach HTML code or the DHTMLX widgets. +A control to attach HTML code or DHTMLX widgets. -The Container control is a very convenient way to develop Form-based solutions. You can improve your project with HTML code or combine several native widgets in one Form to make the project functional and easy to use. You cannot attach Layout and Form widgets. +The Container control helps you build Form-based solutions. You can extend a Form with HTML code or combine several native widgets in one Form. -## How to start +You cannot attach Layout and Form widgets. -You can add the Container control to the Form in an easy way. +## How to start -You need to specify the type of the control `type: "container"` during the initialization of Form and then use one of the methods: +To add the Container control to a Form, set `type: "container"` during Form initialization, then use one of the methods: -- [](form/api/container/container_attachhtml_method.md) - for HTML code -- [](form/api/container/container_attach_method.md) - for DHTMLX widget +- [](form/api/container/container_attachhtml_method.md) — for HTML code +- [](form/api/container/container_attach_method.md) — for DHTMLX widgets -You can also attach the HTML code directly to the Container control. Look at the sample above. +You can also attach HTML code directly to the Container control — see the sample above. ## Methods -[List of the Container control methods](form/api/api_overview.md#container-methods) +[List of Container methods](form/api/api_overview.md#container-methods) -You can manipulate the Container control by using methods of the object returned by the [getItem()](form/api/form_getitem_method.md) method. Use methods to hide or show Container, set and get properties, etc. +You can manage the Container control with the methods of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns. These methods hide and show Container, and set and get its properties. ## Events -[List of the Container control events](form/api/api_overview.md#container-events) +[List of Container events](form/api/api_overview.md#container-events) -You can manipulate the Container control by using events of the object returned by the [getItem()](form/api/form_getitem_method.md) method. +You can manage the Container control with the events of the object that the [`getItem()`](form/api/form_getitem_method.md) method returns. ## Properties -[List of the Container control properties](form/api/container/api_container_properties.md) +[List of Container properties](form/api/container/api_container_properties.md) -The list of the properties is used to configure the Container control. For example, to specify css, height, width, padding, etc. +These properties configure the Container control — for example, `css`, `height`, `width`, and `padding`. From 7305443f82f00aee2715bb9b2025962b42ef38f5 Mon Sep 17 00:00:00 2001 From: Serhii Pylypchuk Date: Mon, 14 Sep 2026 15:19:50 +0300 Subject: [PATCH 10/27] [update] grammar and style in Form customization - "You can modify styling of Form controls as well using the **css** option inside the object of a related control" was the page's own sentence and its worst one: css in bold instead of backticks, a gerund noun with an of-chain, two adverbials running together without a comma, and another of-chain at the end. Now "You can also style individual Form controls with the `css` option in the control configuration object" - fixed the shared CSS boilerplate: "a new CSS class(es)", the <style> entity, lowercase list items, the "don't forget to" parenthetical, "There is a possibility to make changes in the look and feel of a form", "For this you need to take the following steps", and the passive "the created CSS class" - removed a trailing space Same boilerplate as combobox/customization.md and dataview/customization.md, which were fixed earlier. It now stands corrected in 3 of the 20 */customization.md files. --- docs/form/customization.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/docs/form/customization.md b/docs/form/customization.md index f667c31e..b1a6843e 100644 --- a/docs/form/customization.md +++ b/docs/form/customization.md @@ -8,15 +8,15 @@ description: You can explore the customization of Form in the documentation of t ## Styling Form -There is a possibility to make changes in the look and feel of a form. +You can change the appearance of a Form. ![Form with a custom teal color theme on input fields and a Send button in DHTMLX Suite](/img/form/custom_style.png) **Related sample**: [Form. Styling (custom CSS)](https://snippet.dhtmlx.com/wnscgb50) -For this you need to take the following steps: +Follow these steps: -- add a new CSS class(es) with desired settings in the <style> section of your HTML page or in your file with styles (don't forget to include your file on the page in this case) +- Add one or more CSS classes with the settings you need. Place them in the ` ~~~ -- specify the name of the created CSS class (or names of classes separated by spaces) as the value of the [](form/api/form_css_config.md) property in the Form configuration: +- Specify the name of the class you created (or several names separated by spaces) as the value of the [](form/api/form_css_config.md) property in the Form configuration: ~~~js const form = new dhx.Form("form_container", { @@ -78,7 +78,7 @@ For example: **Related sample**: [Form. Styling (custom CSS)](https://snippet.dhtmlx.com/wnscgb50) -You can modify styling of Form controls as well using the **css** option inside the object of a related control. +You can also style individual Form controls with the `css` option in the control configuration object. ~~~html