RadListBox selectedItem when inside of RadExpander

1 Answer 26 Views
Expander ListBox
Top achievements
Rank 1
Deltaohm asked on 24 Aug 2021, 11:07 AM | edited on 25 Aug 2021, 01:32 PM

Hi all,

I have a RadListBox inside a RadExpander. I can't get the notify of SelectedItem, SelectedValue etc
How can manage the selection in this scenario.
Thank you in advance


<DataTemplate x:Key="PanelBarCursorTemplate">
			<t:RadExpander t:AnimationManager.IsAnimationEnabled="True">
				<t:RadExpander.Header >
					<StackPanel Orientation="Horizontal"  >
						<CheckBox Margin="10 5 5 5" VerticalAlignment="Center" IsChecked="{Binding IsChecked}"/>
						<TextBlock Text="{Binding Name}" VerticalAlignment="Center" />
						<TextBlock Text="{Binding Internal.PositionX, StringFormat={StaticResource ResourceKey=StringFormatTime}}" VerticalAlignment="Center" Margin="5 0"/>
					<StackPanel Orientation="Vertical" Margin="5 0 0 0" VerticalAlignment="Center">
						<t:RadGridView ItemsSource="{Binding Internal.PositionsY}"
								<t:GridViewDataColumn DataMemberBinding="{Binding ParameterName}" Width="50"/>
								<t:GridViewDataColumn DataMemberBinding="{Binding ParameterValue}" Width="50"/>
						<!--<TextBlock Text="{Binding Internal.PositionY, StringFormat={}{0:F4}}"	
							   Visibility="{Binding PositionYVisibility, Converter={StaticResource BoolToVis}}"/>-->

				<t:RadListBox ItemsSource="{Binding TabRisultati.Cursori}" 
							  ItemTemplate="{StaticResource PanelBarCursorTemplate}"
							  SelectedItem="{Binding TabCursori.SelectedCursor}"/>

1 Answer, 1 is accepted

Sort by
Martin Ivanov
Telerik team
answered on 26 Aug 2021, 11:32 AM

Hello Luigi,

The selection in this concrete setup collide with the input actions of the other controls. More specifically with the click on the expander's header and the RadGridView items. Those events consume the click action which means that it doesn't reach the RadListBoxItem, thus the selection doesn't work. In order to select a RadListBoxItem in this situation you will need to click on the small space near the edges of the item where no expander or gridview are rendered.

To achieve your requirement, you can subscribe to the MouseLeftButtonDown event of RadListBox. In the event handler, you can check if the click happens over the RadExpander control. If this is the case, then you can manually update the SelectedItem of the listbox. For example:

private void RadListBox_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
	var clickedElement = (FrameworkElement)e.OriginalSource;
	var parentExpander = clickedElement.ParentOfType<RadExpander>();
	if (parentExpander != null)
		listBox.SelectedItem = parentExpander.DataContext;

Note that in order for the handler to be invoked, you will need to use the AddHandler() method with its last parameter set to true.

this.listBox.AddHandler(RadListBox.MouseLeftButtonDownEvent, new MouseButtonEventHandler(RadListBox_MouseLeftButtonDown), true);

I also attached a small example showing this approach. I hope that helps.

Martin Ivanov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Top achievements
Rank 1
commented on 27 Aug 2021, 12:55 PM

Thank you Martin it was what I needed


Expander ListBox
Asked by
Top achievements
Rank 1
Answers by
Martin Ivanov
Telerik team
Share this question