The click actions (like cell selection and sorting) stop working when RadDataGrid is hosted in a RadTabControl or TabView. To reproduce this, you should select the tab item with the data grid, then select another tab, and select back the tab with the data grid. This prevents the hit testing in the RadDataGrid element.

The issue occurs because the hit test service used in the RadDataGrid implementation. The hit test service relies on the IsLoaded property of RadDataGrid (inherited from RadControl). The property is set in the Loaded and Unloaded events. However, when switching tabs, the Unloaded event is invoked on deselection, but on second selection of the same tab, the Loaded event is never called again,  thus IsLoaded is false. This seems like an issue in WinUI.  Something very similar is reported here.

To work this around, you can subscribe to the PreviewSelectionChanged event of RadTabControl and manually update the internal isLoaded field of the data grid.

 private void RadTabControl_PreviewSelectionChanged(object sender, Telerik.UI.Xaml.Controls.RadSelectionChangedEventArgs e)
 {
     if (e.AddedItems.Count > 0)
     {
         var gridView = ((RadTabItem)e.AddedItems[0]).Content as RadDataGrid;
         var isLoadedField = typeof(RadControl).GetField("isLoaded", System.Reflection.BindingFlags.Instance | System.Reflection.BindingFlags.NonPublic);
         isLoadedField.SetValue(gridView, true);
     }
 }

IndexOutOfRangeException occurs in some situations when updating the ItemsSource collection of RadDataGrid. In order to reproduce the issue, the ItemsSource collection should be cleared by calling its Clear method. When you add a specific number of items after that the error occurs. The number of added items depends on the viewport's height.

To work this around, instead of calling the Clear() method of the ItemsSource collection, remove the items one by one.

var collection = (ObservableCollection<MyModel>)this.dg.ItemsSource;
 while (collection.Count > 0)
 {
     collection.RemoveAt(collection.Count - 1);
 }

This is the same feature as the "FilterRow" FilteringMode setting of RadGridView for WPF.

Hi Support

I'm using RadDataGrid on several pages in my application. There a pages where the scrollbar does not appear. On some pages it works.

The structure of the pages is similar. What are your suggestions to look for.

Regards,

Hans

Hello, I tried to implement the sample application from your docs. (https://docs.telerik.com/devtools/winui/controls/raddatagrid/row-details)

But it seems to be not working, the detail area is not displayed completely. Only one column.

I have a similar behavior on another application.

Details:

• .NET 7
• Windows 11 Pro Version 23H2 (22631.3155)
• Telerik WinUI 2.9.0

The default behavior of the WinUI native Popup is to render within the bounds of its owner element. This means if the DataGrid reaches the end of the window and there is not enough space for the filtering control to draw, it will get clipped.

To avoid the clipping and allow the Popup to get displayed outside of the window, the ShouldConstrainToRootBounds property of the Popup should be set to false. 

Add an API in the RadDataGrid control to allow setting the ShouldConstrainToRootBounds option of the Popup.

In the meantime, you can disable the Popup constrain via an implicit Style in App.xaml:

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>                
            <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
            <ResourceDictionary Source="ms-appx:///Telerik.WinUI.Controls/Themes/Generic.xaml"/>
            <!-- Other merged dictionaries here -->
        </ResourceDictionary.MergedDictionaries>
        <Style TargetType="Popup">
            <Setter Property="ShouldConstrainToRootBounds" Value="False" />
        </Style>
        <!-- Other app resources here -->
    </ResourceDictionary>
</Application.Resources>

The field filters in the DataGridNumericalFilterControl of DataGridNumericalColumn are using RadNumericBox controls for the input visuals. By default RadNumericBox is limited to values between 0 and 100, which means you cannot enter values outside of this range.

To work this around, you can re-template the DataGridNumericalFilterControl in order to set the Minimum and Maximum properties of the RadNumericBox element to NaN.

<Application
    x:Class="App3.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App3" xmlns:telerikDataGrid="using:Telerik.UI.Xaml.Controls.Grid.Primitives" xmlns:telerikInput="using:Telerik.UI.Xaml.Controls.Input">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                <ResourceDictionary Source="ms-appx:///Telerik.WinUI.Controls/Themes/Generic.xaml"/>
            </ResourceDictionary.MergedDictionaries>

            <Style TargetType="telerikDataGrid:DataGridNumericalFilterControl">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="telerikDataGrid:DataGridNumericalFilterControl">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <ComboBox x:Name="PART_OperatorCombo"
                                          HorizontalAlignment="Stretch"
                                          ItemsSource="{Binding OperatorsList}"
                                          SelectedItem="{Binding FilterDescriptor.Operator, Mode=TwoWay, Converter={StaticResource FilterOperatorConverter}}"
                                          DisplayMemberPath="DisplayText">
                                </ComboBox>
                                <telerikInput:RadNumericBox x:Name="PART_ValueBox"
                                                            Minimum="NaN"
                                                            Maximum="NaN"
                                              HorizontalAlignment="Stretch"
                                              Value="{Binding FilterDescriptor.Value, Mode=TwoWay}"
                                              Grid.Row="1" Margin="0 10 0 0"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </Application.Resources>
</Application>

Dynamically changing the Header of a RadDataGrid column is clearing the header visual's content. This means that you no longer see the header. To reproduce this the SizeMode of the column should be set to Fixed.

To work this around, instead of changing the Header of the column, you can assign the Header initially to a visual element - like TextBox - and change its content (like the Text property). Or alternatively, avoid the Fixed SizeMode.

Remove the space reserved for the sort indicator in the column header, when CanUserSort is False and therefore the sort indicator is not displayed. The current behavior prevents the user to easily center the header text.

To work this around, you can edit the ControlTemplate of DataGridColumnHeader. In the template, you can update the Visibility of the TextBlock with x:Name set to "SortIndicator" when CanUserSort is False.