ES_978601: UG documentation for updating ShowClearButton functionality for TreeGrid and DataGrid for Numeric and Date Columns (HotFix)

winui/DataGrid/Column-Types.md

@@ -827,6 +827,38 @@ You can restrict the users to enter input within a minimum and maximum range in
 {% endhighlight %}
 {% endtabs %}
 
+### Clear Button support
+
+The `GridNumericColumn` provides a clear button feature that enables users to reset cell values during editing using the [ShowClearButton](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridNumericColumn.html#Syncfusion_UI_Xaml_DataGrid_GridNumericColumn_ShowClearButton) property.
+When `ShowClearButton` is set to `True`, a clear button is displayed in the cell editor, enabling users to clear the cell’s value during editing.
+
+#### AllowNull Behavior
+
+The behavior of the clear button depends on the [AllowNull](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridNumericColumn.html#Syncfusion_UI_Xaml_DataGrid_GridNumericColumn_AllowNull) property:
+
+ - When `AllowNull` is `True`, clicking the clear button sets the cell value to null.
+
+ - When `AllowNull` is `False`, clicking the clear button sets the cell value to the column's [MinValue](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridNumericColumn.html#Syncfusion_UI_Xaml_DataGrid_GridNumericColumn_MinValue).
+
+{% tabs %}
+{% highlight xaml %}
+<dataGrid:SfDataGrid x:Name="dataGrid" 
+                       ItemsSource="{Binding Orders}"
+                       AutoGenerateColumns="False"
+                       AllowEditing="True" >
+    <dataGrid:SfDataGrid.Columns>
+        <dataGrid:GridNumericColumn MappingName="Order ID" HeaderText="Order ID" ShowClearButton="True" />
+        <dataGrid:GridTextColumn MappingName="CustomerName" HeaderText="Customer Name" />
+        <dataGrid:GridTextColumn MappingName="Country" HeaderText="Country" />
+        <dataGrid:GridTextColumn MappingName="Customer ID" HeaderText="Customer ID" />
+        <dataGrid:GridNumericColumn MappingName="Quantity" HeaderText="Quantity" />    
+    </dataGrid:SfDataGrid.Columns>
+</dataGrid:SfDataGrid>
+{% endhighlight %}
+{% endtabs %}
+
+<img src="Column-Types_images\winui-datagrid-NumericColumn-ShowClearButton.png" alt="WinUI DataGrid NumericColumn with Clear Button" width="100%" Height="Auto"/>
+
 ### UpDown button placement
 
 You can increase or decrease the value of the `GridNumericColumn` using the up-down button. By default, the value of [UpDownPlacementMode](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridNumericColumn.html#Syncfusion_UI_Xaml_DataGrid_GridNumericColumn_UpDownPlacementMode) property is [Hidden](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.NumberBoxUpDownPlacementMode.html#Syncfusion_UI_Xaml_Editors_NumberBoxUpDownPlacementMode_Hidden). You can change the up-down button position by assigning the value `UpDownPlacementMode` property as [Inline](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.NumberBoxUpDownPlacementMode.html#Syncfusion_UI_Xaml_Editors_NumberBoxUpDownPlacementMode_Inline) or [Compact](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.NumberBoxUpDownPlacementMode.html#Syncfusion_UI_Xaml_Editors_NumberBoxUpDownPlacementMode_Compact).
@@ -932,6 +964,39 @@ The `PlaceholderText` does not shown, when the `AllowNull` is `false`.
 
 You can restrict and display the input value within the range using [MinDate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridDateColumn.html#Syncfusion_UI_Xaml_DataGrid_GridDateColumn_MinDate) and [MaxDate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridDateColumn.html#Syncfusion_UI_Xaml_DataGrid_GridDateColumn_MaxDate) properties.
 
+### Clear Button support
+
+The `GridDateColumn` provides a clear button feature that enables users to reset cell values during editing using the [ShowClearButton](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridDateColumn.html#Syncfusion_UI_Xaml_DataGrid_GridDateColumn_ShowClearButton) property.
+When `ShowClearButton` is set to `True`, a clear button appears within the editor, providing users with a convenient way to clear the cell's value.
+
+#### AllowNull Behavior
+
+The behavior of the clear button depends on the [AllowNull](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridDateColumn.html#Syncfusion_UI_Xaml_DataGrid_GridDateColumn_AllowNull) property:
+
+- When `AllowNull` is `True`, clicking the clear button sets the cell value to `null`.
+
+- When `AllowNull` is `False`, clicking the clear button sets the cell value to the column's [MinDate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.DataGrid.GridDateColumn.html#Syncfusion_UI_Xaml_DataGrid_GridDateColumn_MinDate).
+
+{% tabs %}
+{% highlight xaml %}
+<dataGrid:SfDataGrid x:Name="dataGrid" 
+                       ItemsSource="{Binding Orders}"
+                       AutoGenerateColumns="False"
+                       AllowEditing="True" >
+    <dataGrid:SfDataGrid.Columns>
+        <dataGrid:GridTextColumn MappingName="Customer ID" HeaderText="Customer ID" />
+        <dataGrid:GridNumericColumn MappingName="Quantity" HeaderText="Quantity" />
+        <dataGrid:GridDateColumn MappingName="Order Date" HeaderText="Order Date" ShowClearButton="True" />
+        <dataGrid:GridTimeColumn MappingName="Order Time" HeaderText="Order Time" />
+        <dataGrid:GridTextColumn MappingName="ShipCity" HeaderText="Ship City" />
+    </dataGrid:SfDataGrid.Columns>
+</dataGrid:SfDataGrid>
+{% endhighlight %}
+{% endtabs %}
+
+<img src="Column-Types_images/winui-datagrid-DateColumn-ShowClearButton.png" alt="WinUI DataGrid DateColumn with Clear Button" width="100%" Height="Auto"/>
+
+
 ## GridCheckBoxColumn
 
 `GridCheckBoxColumn` derived from `GridColumn` and it used display and edit `Boolean` type data. It hosts `CheckBox` element as `GridCell` content.

winui/TreeGrid/ColumnTypes.md

@@ -821,6 +821,42 @@ You can restrict the users to enter input within a minimum and maximum range in
 {% endhighlight %}
 {% endtabs %}
 
+### Clear Button support
+
+The `TreeGridNumericColumn` provides a clear button feature that enables users to reset cell values during editing using the [ShowClearButton](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridNumericColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridNumericColumn_ShowClearButton) property.
+When `ShowClearButton` is set to `True`, a clear button appears within the editor, providing users with a convenient way to clear the cell's value.
+
+#### AllowNull Behavior
+
+The behavior of the clear button depends on the [AllowNull](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridNumericColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridNumericColumn_AllowNull) property:
+
+ - When `AllowNull` is to `True`, clicking the clear button sets the cell value to `null`.
+ - When `AllowNull` is to `False`, clicking the clear button sets the cell value to the column's
+  [MinValue](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridNumericColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridNumericColumn_MinValue).
+
+{% tabs %}
+{% highlight xaml %}
+<treeGrid:SfTreeGrid Name="sfTreeGrid"
+                        ChildPropertyName="ReportsTo"
+                        ParentPropertyName="ID"
+                        SelfRelationRootValue="-1"
+                        AutoExpandMode="AllNodesExpanded"
+                        ItemsSource="{Binding Employees}"
+                        AllowEditing="True">
+    <treeGrid:SfTreeGrid.Columns>
+        <treeGrid:TreeGridNumericColumn HeaderText="Employee ID" MappingName="ID" ShowClearButton="True"/>
+        <treeGrid:TreeGridTextColumn HeaderText="First Name" MappingName="FirstName" />
+        <treeGrid:TreeGridTextColumn HeaderText="Last Name" MappingName="LastName" />
+        <treeGrid:TreeGridNumericColumn HeaderText="Salary" MappingName="Salary" />
+        <treeGrid:TreeGridNumericColumn HeaderText="Reports To" MappingName="ReportsTo" />
+        <treeGrid:TreeGridDateColumn HeaderText="Joining Date" MappingName="JoiningDate" Width="150"/>
+    </treeGrid:SfTreeGrid.Columns>
+</treeGrid:SfTreeGrid>
+{% endhighlight %}
+{% endtabs %}
+
+<img src="Column-Type-images\winui-treegrid-NumericColumn-ShowClearButton.png" alt="WinUI TreeGrid NumericColumn with Clear Button" width="100%" Height="Auto"/>
+
 ### UpDown button placement
 
 You can increase or decrease the value of the `TreeGridNumericColumn` using the up-down button. By default, the value of [UpDownPlacementMode](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridNumericColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridNumericColumn_UpDownPlacementMode) property is [Hidden](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.NumberBoxUpDownPlacementMode.html#Syncfusion_UI_Xaml_Editors_NumberBoxUpDownPlacementMode_Hidden). You can change the up-down button position by assigning the value `UpDownPlacementMode` property as [Inline](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.NumberBoxUpDownPlacementMode.html#Syncfusion_UI_Xaml_Editors_NumberBoxUpDownPlacementMode_Inline) or [Compact](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.NumberBoxUpDownPlacementMode.html#Syncfusion_UI_Xaml_Editors_NumberBoxUpDownPlacementMode_Compact).
@@ -939,6 +975,41 @@ The `PlaceholderText` is not displayed, when the `AllowNull` is set to `false`.
 
 You can restrict and display the input value within the range using the [MinDate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridDateColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDateColumn_MinDate) and [MaxDate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridDateColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDateColumn_MaxDate) properties.
 
+### Clear Button support
+
+The `TreeGridDateColumn` provides a clear button feature that enables users to reset cell values during editing using the [ShowClearButton](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridDateColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDateColumn_ShowClearButton) property.
+When `ShowClearButton` is set to `True`, a clear button appears within the editor, providing users with a convenient way to clear the cell's value.
+
+#### AllowNull Behavior
+The behavior of the clear button depends on the [AllowNull](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridDateColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDateColumn_AllowNull) property:
+
+- When `AllowNull` is `True`, clicking the clear button sets the cell value to null.
+- When `AllowNull` is `False`, clicking the clear button sets the cell value to the column's [MinDate](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridDateColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDateColumn_MinDate).
+
+{% tabs %}
+{% highlight xaml %}
+<dataGrid:SfTreeGrid x:Name="dataGrid" 
+<treeGrid:SfTreeGrid Name="sfTreeGrid"
+                        ChildPropertyName="ReportsTo"
+                        ParentPropertyName="ID"
+                        SelfRelationRootValue="-1"
+                        AutoExpandMode="AllNodesExpanded"
+                        ItemsSource="{Binding Employees}"
+                        AllowEditing="True">
+    <treeGrid:SfTreeGrid.Columns>
+        <treeGrid:TreeGridNumericColumn HeaderText="Employee ID" MappingName="ID"/>
+        <treeGrid:TreeGridTextColumn HeaderText="First Name" MappingName="FirstName" />
+        <treeGrid:TreeGridTextColumn HeaderText="Last Name" MappingName="LastName" />
+        <treeGrid:TreeGridNumericColumn HeaderText="Salary" MappingName="Salary" />
+        <treeGrid:TreeGridNumericColumn HeaderText="Reports To" MappingName="ReportsTo" />
+        <treeGrid:TreeGridDateColumn HeaderText="Joining Date" MappingName="JoiningDate" Width="150" ShowClearButton="True"/>
+    </treeGrid:SfTreeGrid.Columns>
+</treeGrid:SfTreeGrid>
+{% endhighlight %}
+{% endtabs %}
+
+<img src="Column-Type-images/winui-treegrid-DateColumn-ShowClearButton.png" alt="WinUI TreeGrid DateColumn with Clear Button" width="100%" Height="Auto"/>
+
 ## TreeGridTimeColumn
 
 [TreeGridTimeColumn](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.TreeGrid.TreeGridTimeColumn.html) is derived from `TreeGridTextColumnBase` and displays column data as time. In editing mode, it hosts the [SfTimePicker](https://help.syncfusion.com/cr/winui/Syncfusion.UI.Xaml.Editors.SfTimePicker.html) element.