Programatically expanding given item

[Ivan]

Hot to programatically expand some item? I would like to do something like:
Items[0].Items[4].Expand()

I know there is a method called ExpandItemByPath but i cannot guess how to use it and documentation says absolutely nothing about it.

Thanks in advance for any help

[Kiril Stanoev]

Hi Ivan,

You can try the following approach:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Button Content="Expand" Click="Expand_Click" />
    <telerik:RadPanelBar x:Name="panelBar1" Grid.Row="1">
        <telerik:RadPanelBarItem Header="Item 1">
            <telerik:RadPanelBarItem Header="Item 1.1">
                <telerik:RadPanelBarItem Header="Item 1.1.1" />
            </telerik:RadPanelBarItem>
        </telerik:RadPanelBarItem>
    </telerik:RadPanelBar>
</Grid>

private void Expand_Click(object sender, RoutedEventArgs e)
{
    var item = this.panelBar1.Items[0] as RadPanelBarItem;
    item.IsExpanded = true;
    var subItem = item.Items[0] as RadPanelBarItem;
    subItem.IsExpanded = true;
}

Let me know how it goes.

All the best,
Kiril Stanoev
the Telerik team

[Ivan]

Hi Kiril,

this solution won't work, as
this.radPanelBar.Items[0] is of type CommandViewModel (we are binding collection of viewmodels for ItemsSource of radpanel)

[Kiril Stanoev]

Hello Ivan,

Thanks for the clarification. Another approach is to expand/collapse using a property within the ViewModel. This can easily be achieved using a binding within the ItemContainerStyle of RadPanelBar:

<telerik:RadPanelBar x:Name="panelBar1">
    <telerik:RadPanelBar.ItemContainerStyle>
        <Style TargetType="telerik:RadPanelBarItem">
            <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
        </Style>
    </telerik:RadPanelBar.ItemContainerStyle>
</telerik:RadPanelBar>

In the above example, Property="IsExpanded" is the IsExpanded property of RadPanelBarItem, whether Value="{Binding IsExpanded, Mode=TwoWay}" is the IsExpanded property of your ViewModel.

Now on a button click you can do something like this:

private void Button_Click(object sender, RoutedEventArgs e)
{
    ObservableCollection<CommandViewModel> dataSource = this.panelBar1.ItemsSource as ObservableCollection<CommandViewModel>;
    CommandViewModel level1 = dataSource[0];
    level1.IsExpanded = true;
    CommandViewModel level2 = level1.Children[0];
    level2.IsExpanded = true;
}

Please refer to the attached project for further information and let me know if this approach satisfies you.

Regards,
Kiril Stanoev
the Telerik team