Merge pull request #35 from DHTMLX/next-v9.0.1

mafanya23 · web-flow · commit a1ff62e9d046 · 2024-12-10T13:36:54.000+03:00
[add] what's new for v9.0.1, update treecollection and grid in treegr…
diff --git a/docs/common_features/custom_scroll.md b/docs/common_features/custom_scroll.md
@@ -12,7 +12,7 @@ From v7.2, DHTMLX includes neat custom scrollbars with a thin grey semi-transpar
 
 <iframe src="https://snippet.dhtmlx.com/gjsbvzdk?mode=result" frameborder="0" class="snippet_iframe" width="100%" height="700"></iframe>
 
-The custom scroll is available for the following DHTMLX components: List, DataView, Grid, TreeGrid, Layout cell, Toolbar, Ribbon, Sidebar, Window.
+The custom scroll is available for the following DHTMLX components: List, DataView, Grid, Grid in the TreeGrid mode, Layout cell, Toolbar, Ribbon, Sidebar, Window.
 
 To add the feature into your application, you need to set the **enable** property of the **dhx.scrollViewConfig** global variable to *true* before initialization of the widgets:
 
diff --git a/docs/data_collection/api/datacollection_sort_method.md b/docs/data_collection/api/datacollection_sort_method.md
@@ -11,9 +11,9 @@ description: You can explore the sort method of DataCollection in the documentat
 @signature: {'sort(rule?: object, config?: object): void;'}
 
 @params:
-- `rule: object` - an object with parameters for sorting. The parameters are:
+- `rule: object` - an object with parameters for sorting. The object has the following attributes:
     - `by: string | number` - the id of a data field (a column of Grid)
-    - `dir: string` - the direction of sorting "asc" or "desc"
+    - `dir: string` - the direction of sorting: "asc" or "desc"
     - `as: function` -  a function that specifies the type to sort data as
     - `rule: function` -  optional, a sorting rule; the function must have two parameters and return a number (-1,0,1)
 - `config: object` - defines the parameter of sorting. It may contain one property:
@@ -31,25 +31,27 @@ grid.data.sort({
     }
 });
 
-// cancels applied sorting rules
+// cancels the applied sorting rules
 grid.data.sort();
 
 @descr:
 
 **Related sample**: [Data. Sorting](https://snippet.dhtmlx.com/lz351u47)
 
-{{note Calling the method without parameters will discard all applied sorting rules.}}
+:::note 
+Calling the method without parameters will discard all applied sorting rules.
+:::
 
 ### Custom sorting
 
-To set a custom function for sorting you need to specify the **rule** attribute in a passed object. For example:
+To set a custom function for sorting, you need to specify the `rule` attribute in a passed object. For example:
 
-~~~js
+~~~jsx
 grid.data.sort({
     rule: (a, b) => a.id > b.id ? 1 : (a.id < b.id ? -1 : 0) 
 });
 ~~~
 
 @changelog:
 
-The **config** parameter is added in v7.0.
+The `config` parameter is added in v7.0.
diff --git a/docs/grid/api/treegrid_mode/grid_aftercollapse_event.md b/docs/grid/api/treegrid_mode/grid_aftercollapse_event.md
@@ -6,7 +6,7 @@ description: You can explore the afterCollapse event of Grid in the documentatio
 
 # afterCollapse
 
-@short: fires after collapsing a treegrid
+@short: fires after collapsing Grid in the TreeGrid mode
 
 :::note
 The event works only for Grid with the `type: "tree"` configuration option
diff --git a/docs/grid/api/treegrid_mode/grid_afterexpand_event.md b/docs/grid/api/treegrid_mode/grid_afterexpand_event.md
@@ -6,7 +6,7 @@ description: You can explore the afterExpand event of Grid in the documentation
 
 # afterExpand
 
-@short: fires after expanding a treegrid
+@short: fires after expanding Grid in the TreeGrid mode
 
 :::note
 The event works only for Grid with the `type: "tree"` configuration option
diff --git a/docs/grid/api/treegrid_mode/grid_beforecollapse_event.md b/docs/grid/api/treegrid_mode/grid_beforecollapse_event.md
@@ -6,7 +6,7 @@ description: You can explore the beforeCollapse event of Grid in the documentati
 
 # beforeCollapse
 
-@short: fires before collapsing a treegrid
+@short: fires before collapsing Grid in the TreeGrid mode
 
 :::note
 The event works only for Grid with the `type: "tree"` configuration option
diff --git a/docs/grid/api/treegrid_mode/grid_beforeexpand_event.md b/docs/grid/api/treegrid_mode/grid_beforeexpand_event.md
@@ -6,7 +6,7 @@ description: You can explore the beforeExpand event of Grid in the documentation
 
 # beforeExpand
 
-@short: fires before expanding a treegrid
+@short: fires before expanding Grid in the TreeGrid mode
 
 :::note
 The event works only for Grid with the `type: "tree"` configuration option
diff --git a/docs/grid/api/treegrid_mode/grid_collapsed_config.md b/docs/grid/api/treegrid_mode/grid_collapsed_config.md
@@ -6,7 +6,7 @@ description: You can explore the collapsed config of Grid in the documentation o
 
 # collapsed
 
-@short: Optional. Defines that a treegrid is initialized in the collapsed state
+@short: Optional. Defines that Grid in the TreeGrid mode is initialized in the collapsed state
 
 :::note
 The property works only for Grid with the `type: "tree"` configuration option
diff --git a/docs/grid/api/treegrid_mode/grid_expand_event.md b/docs/grid/api/treegrid_mode/grid_expand_event.md
@@ -6,7 +6,7 @@ description: You can explore the expand event of Grid in the documentation of th
 
 # expand
 
-@short: fires before collapsing a treegrid
+@short: fires before collapsing Grid in the TreeGrid mode
 
 :::note
 The event works only for Grid with the `type: "tree"` configuration option
diff --git a/docs/guides/datacollection_guide.md b/docs/guides/datacollection_guide.md
@@ -9,7 +9,7 @@ description: You can learn how to work with DataCollection in the documentation
 The DHTMLX library includes two invisible components (in other words, helpers) that serve to store data:
 
 - [DataCollection](data_collection.md/) - stores a non-hierarchical set of data (data for Chart, Combobox, DataView, Grid, List)
-- [TreeCollection](tree_collection.md/) - stores a hierarchical set of data (data for Menu, Ribbon, Sidebar, Toolbar, Tree, TreeGrid)
+- [TreeCollection](tree_collection.md/) - stores a hierarchical set of data (data for Menu, Ribbon, Sidebar, Toolbar, Tree, Grid in the TreeGrid mode)
 
 API methods and events of DataCollection and TreeCollection let you work with data items, namely to load, process, and edit the items.
 
diff --git a/docs/helpers/custom_scroll.md b/docs/helpers/custom_scroll.md
@@ -12,15 +12,17 @@ description: You can have an overview of Custom Scroll in the documentation of t
 
 The feature can be activated on the page for all widgets at once via the **enable** property of the **dhx.scrollViewConfig** global variable before initialization of the widgets:
 
-```js
+~~~js
 dhx.scrollViewConfig.enable = true; // false by default
 
 // initializing widgets
-```
+~~~
 
 **Related sample:** [Custom scroll. Scroll view in List, Dataview](https://snippet.dhtmlx.com/gjsbvzdk)
 
-{{note As a result of the above logic, DHTMLX custom scrollbars will be applied to the following widgets: List, DataView, Grid, TreeGrid, Layout cell, Toolbar, Ribbon, Sidebar, Window.}}
+:::note 
+As a result of the above logic, DHTMLX custom scrollbars will be applied to the following widgets: List, DataView, Grid, Grid in the TreeGrid mode, Layout cell, Toolbar, Ribbon, Sidebar, Window.
+:::
 
 ## Custom scroll settings
 
@@ -77,7 +79,9 @@ list.scrollView.enable();
 list.scrollView.disable();
 ~~~
 
-{{note Try out the functionality [in our Snippet Tool](https://snippet.dhtmlx.com/gjsbvzdk).}}
+:::note 
+Try out the functionality [in our Snippet Tool](https://snippet.dhtmlx.com/gjsbvzdk).
+:::
 
 To force recalculation and redrawing of the custom scroll, apply the **update()** method: 
 
diff --git a/docs/optimus_guides/exam_demo.md b/docs/optimus_guides/exam_demo.md
@@ -10,7 +10,7 @@ description: You can explore how to work with Online Exam Demo using Optimus Fra
 
 ![](../assets/optimus/demo/examsystem_demo.png)
 
-This demo application shows how to create an online examination system for an educational project with subjects, exams, and students' results. It is developed using DHTMLX Suite widgets: TreeGrid, Form, Sidebar, and Toolbar.
+This demo application shows how to create an online examination system for an educational project with subjects, exams, and students' results. It is developed using DHTMLX Suite widgets: Grid in the TreeGrid mode, Form, Sidebar, and Toolbar.
 
 ## How to download
 
@@ -28,7 +28,7 @@ To run the demo, follow the instructions in the README.md file.
 
 ## Demo overview
 
-The online exam system is a ready-to-use tool for online examination. You can create an online exam using the Form in the demo app in several steps. Also, it is possible to modify the Form easily as you need. The TreeGrid widget is used to manage the examination process.
+The online exam system is a ready-to-use tool for online examination. You can create an online exam using the Form in the demo app in several steps. Also, it is possible to modify the Form easily as you need. The Grid in the TreeGrid mode widget is used to manage the examination process.
 
 The online exam system demo is built with the help of the DHTMLX Optimus framework. The components of the demo are divided into Views. You can initialize or modify each component separately. Any component can be removed. The demo can be taken as a View itself and become a component of another app.
 
diff --git a/docs/optimus_guides/hospital_demo.md b/docs/optimus_guides/hospital_demo.md
@@ -10,7 +10,7 @@ description: You can explore how to work with Hospital Management Demo using Opt
 
 ![](../assets/optimus/demo/hospital_demo.png)
 
-This demo application shows how to create a hospital management system with a clear and accurate UI based on DHTMLX Diagram and DHTMLX Suite widgets: Sidebar, TreeGrid, Tabbar, Dataview, Window, Toolbar, and Form.
+This demo application shows how to create a hospital management system with a clear and accurate UI based on DHTMLX Diagram and DHTMLX Suite widgets: Sidebar, Grid in the TreeGrid mode, Tabbar, Dataview, Window, Toolbar, and Form.
 
 ## How to download
 
@@ -32,7 +32,7 @@ The hospital management system demo is a complex solution to show you how DHTMLX
 
 Pay attention to how the Patient Registration Form is realized. Here you can find built-in Datepicker, Combobox, Input fields, RadioGroup controls, and even more.
 
-Treegrid is the main widget of the demo. With the help of it, you can manage the hospital in real-time. Tabbar helps you to organize the information in the Treegrid in a convenient way.
+Grid in the TreeGrid mode is the main widget of the demo. With the help of it, you can manage the hospital in real-time. Tabbar helps you to organize the information in the Grid in the TreeGrid mode in a convenient way.
 
 DHTMLX diagram is one more feature of the demo. It helps to visualize a hospital management hierarchy.
 
diff --git a/docs/pagination/features.md b/docs/pagination/features.md
@@ -23,7 +23,7 @@ In this section you can find out how to initialize Pagination with different dat
 | [Pagination with Grid](https://snippet.dhtmlx.com/0sku3cfa)     | The example shows how to initialize Grid inside Pagination     |
 | [Pagination with List](https://snippet.dhtmlx.com/6sju9jl5)     | The example shows how to initialize List inside Pagination     |
 | [Pagination with Tree](https://snippet.dhtmlx.com/a0jhoipw)     | The example shows how to initialize Tree inside Pagination     |
-| [Pagination with TreeGrid](https://snippet.dhtmlx.com/uxz8lh7m) | The example shows how to initialize TreeGrid inside Pagination |
+| [Pagination with Grid in the TreeGrid mode](https://snippet.dhtmlx.com/uxz8lh7m) | The example shows how to initialize Grid in the TreeGrid mode inside Pagination |
 
 ### Integration
 
diff --git a/docs/pagination/index.md b/docs/pagination/index.md
@@ -11,7 +11,7 @@ The Pagination component is available in the **PRO** version only.
 }}
 
 DHTMLX Pagination helps to divide large amount of data into groups and display them on discrete pages. 
-The component is easy-to-use and provides handy navigation that allows you to quickly jump to a desired page. DHTMLX Pagination is available in combination with data components like DataView, List, Grid, Tree, Treegrid. Check [online samples for DHTMLX Pagination](https://snippet.dhtmlx.com/05r4s63b?tag=pagination).
+The component is easy-to-use and provides handy navigation that allows you to quickly jump to a desired page. DHTMLX Pagination is available in combination with data components like DataView, List, Grid, Tree, Grid in the TreeGrid mode. Check [online samples for DHTMLX Pagination](https://snippet.dhtmlx.com/05r4s63b?tag=pagination).
 
 ![](../assets/pagination/init.png)
 
diff --git a/docs/pagination/init.md b/docs/pagination/init.md
@@ -55,7 +55,7 @@ To add DHTMLX Pagination into an application, you need to take the following sim
 
 **Related sample**: [Pagination. Pagination with Grid](https://snippet.dhtmlx.com/0sku3cfa)
 
-**Related sample**: [Pagination. Pagination with TreeGrid](https://snippet.dhtmlx.com/uxz8lh7m)
+**Related sample**: [Pagination. Pagination with Grid in the TreeGrid mode](https://snippet.dhtmlx.com/uxz8lh7m)
 
 ## Include source files
 
diff --git a/docs/selection/index.md b/docs/selection/index.md
@@ -6,7 +6,7 @@ description: You can have an overview of the Selection object in the documentati
 
 # Selection overview
 
-A set of APIs that allow you to work with the Selection object. You can use the API of the Selection object when working with the following components: DataView, List, Tree, Grid, TreeGrid.
+A set of APIs that allow you to work with the Selection object. You can use the API of the Selection object when working with the following components: DataView, List, Tree, Grid, Grid in the TreeGrid mode.
 
 ## DataView, List, Tree
 
@@ -34,20 +34,20 @@ You can apply the following events of the Selection object when working with the
 | [](selection/api/selection_beforeselect_event.md)   | @getshort(selection/api/selection_beforeselect_event.md)   |
 | [](selection/api/selection_beforeunselect_event.md) | @getshort(selection/api/selection_beforeunselect_event.md) |
 
-## Grid, TreeGrid
+## Grid, Grid in the TreeGrid mode
 
 ### Methods
 
-See the full lists of the methods of the Selection object you can use to manage the selection of cells in **Grid**, **TreeGrid**:
+See the full lists of the methods of the Selection object you can use to manage the selection of cells in **Grid**, **Grid in the TreeGrid mode**:
 
 - [Grid. Selection methods](grid/api/api_overview.md#selection-methods)
 
-- [TreeGrid. Selection methods](grid/api/api_overview.md#selection-methods) 
+- [Grid in the TreeGrid mode. Selection methods](grid/api/api_overview.md#selection-methods) 
 
 ### Events
 
-See the full lists of the events of the Selection object you can use while working with the selection of cells in **Grid**, **TreeGrid**:
+See the full lists of the events of the Selection object you can use while working with the selection of cells in **Grid**, **Grid in the TreeGrid mode**:
 
 - [Grid. Selection events](grid/api/api_overview.md#selection-events)
 
-- [TreeGrid. Selection events](grid/api/api_overview.md#selection-events) 
+- [Grid in the TreeGrid mode. Selection events](grid/api/api_overview.md#selection-events) 
diff --git a/docs/tree_collection/api/treecollection_filter_method.md b/docs/tree_collection/api/treecollection_filter_method.md
@@ -44,4 +44,4 @@ treeGrid.data.filter({
 
 @descr:
 
-**Related sample**: [TreeGrid. Filter](https://snippet.dhtmlx.com/epsslwcd)
+**Related sample**: [Grid (TreeGrid). Filter](https://snippet.dhtmlx.com/epsslwcd)
diff --git a/docs/tree_collection/api/treecollection_serialize_method.md b/docs/tree_collection/api/treecollection_serialize_method.md
@@ -18,12 +18,12 @@ Serialized data of the component either as an array of JSON objects or as a CSV/
 
 @example:
 // serialize data into an array of JSON objects
-treegrid.data.serialize();
+component.data.serialize();
 
 // serialize data into an XML string
-treegrid.data.serialize("xml");
+component.data.serialize("xml");
 
 // serialize data into a CSV string
-treegrid.data.serialize("csv");
+component.data.serialize("csv");
 
 @descr:
diff --git a/docs/tree_collection/api/treecollection_sort_method.md b/docs/tree_collection/api/treecollection_sort_method.md
@@ -8,32 +8,48 @@ description: You can explore the sort method of TreeCollection in the documentat
 
 @short: sorts controls according to some criteria
 
-@signature: {'sort(rule?: object): void;'}
+@signature: {'sort(rule?: object, config?: object): void;'}
 
 @params:
 - `rule: object` - an object with parameters for sorting. The object has the following attributes:
-    - `by: string | number` - the id of a data field (a column of TreeGrid)
-    - `dir: string` - the direction of sorting "asc" or "desc"
+    - `by: string | number` - the id of a data field (a column of Grid in the TreeGrid mode)
+    - `dir: string` - the direction of sorting: "asc" or "desc"
     - `as: function` - a function that specifies the type to sort data as
     - `rule: function` - optional, a sorting rule; the function must have two parameters and return a number (-1,0,1)
+- `config: object` - defines the parameter of sorting. It may contain one property:
+    - `smartSorting: boolean` - specifies whether a sorting rule should be applied each time after changing the data set
 
 @example:
-treeGrid.data.sort({
+component.data.sort({
     by: "price",
     dir: "asc",
-    as: function (value) { return value ? value : "" }
+    as: function(value){ 
+        return value ? value : "" 
+    },
+    {
+        smartSorting: true
+    }
 });
 
+// cancels the applied sorting rules
+component.data.sort();
+
 @descr:
 
-{{note Calling the method without parameters will discard all applied sorting rules.}}
+:::note 
+Calling the method without parameters will discard all applied sorting rules.
+:::
 
 ### Custom sorting
 
-To set a custom function for sorting you need to specify the **rule** attribute in a passed object. For example:
+To set a custom function for sorting, you need to specify the `rule` attribute in a passed object. For example:
 
-~~~js
-treegrid.data.sort({
+~~~jsx
+component.data.sort({
     rule: (a,b) => (a.type < b.type) ? -1 : ( (a.type > b.type) ? 1 : 0 )
 });
 ~~~
+
+@changelog:
+
+The `config` parameter is added in v9.0.
diff --git a/docs/tree_collection/index.md b/docs/tree_collection/index.md
@@ -6,7 +6,7 @@ description: You can have an overview of TreeCollection in the documentation of
 
 # TreeCollection overview
 
-A set of API methods and events that allow you to work with data of a component with tree-like structure. Applicable to Menu, Ribbon, Sidebar, Toolbar, Tree, TreeGrid.
+A set of API methods and events that allow you to work with data of a component with tree-like structure. Applicable to Menu, Ribbon, Sidebar, Toolbar, Tree, Grid in the TreeGrid mode.
 
 ## Methods
 
@@ -64,17 +64,17 @@ A set of API methods and events that allow you to work with data of a component
 
 To call the event of TreeCollection, you may use either of the two syntaxes:
 
-- common syntax (via the **data** object of the component)
+- common syntax (via the `data` object of the component)
 
-~~~js
+~~~jsx
 menu.data.events.on("afterAdd", function(newItem){
     console.log("A new item is added");
 });
 ~~~
 
 - or short syntax (right through the component)
 
-~~~js
+~~~jsx
 menu.events.on("afterAdd", function(newItem){
     console.log("A new item is added");
 });
diff --git a/docs/whatsnew.md b/docs/whatsnew.md
@@ -8,6 +8,31 @@ description: You can explore what's new in DHTMLX Suite and its release history
 
 Before updating DHTMLX to the latest version, please check the [Migration to Newer Versions](migration.md) guide to avoid possible breakdowns.
 
+Version 9.0.1 
+------------------
+
+Released on December 10, 2024
+
+### Fixes
+
+- Core. The issue with the local trial package during import to frameworks
+- DataCollection. Adding multiple elements at index -1 will distribute the elements throughout the collection
+- DataCollection. The `find()`/`findAll()` method miss the `index` and `array` arguments, when the parameter is set as a function
+- DataCollection. The `add()` method mutates the added object
+- DataCollection. Data preparation in the config is removed (old realization)
+- DataCollection. After parsing the grouped data, the old data is displayed
+- Form. The issue with the destruction of items in Optimus
+- Grid. Multiselection. Reselection of the first selected row doesn't work
+- Grid. The export module typization is added
+- Grid. The use of `footerAutoHeight` with `summary` causes an error
+- Message. Incorrect text wrapping
+- Tree. Selection isn't applied after dragging an item to another Tree
+- TreeCollection. The `smartSorting` property is missed in the configuration of the `sort()` method
+- TreeCollection. The `filter()` method allows specifying an invalid configuration 
+- TreeCollection. The `move()` method calculates the movements incorrectly when moving an array of elements
+- TreeCollection. The `move()` method doesn't allow being called without additional arguments
+- TreeCollection. The ability to create a non-existent parent
+
 Version 9.0
 ---------------
 
