Tabbing between TextBoxes in RadPanelBar

4 posts, 0 answers
  1. haagel
    haagel avatar
    52 posts
    Member since:
    Feb 2010

    Posted 05 Jan 2011 Link to this post

    I have a simple RadPanelBar with ExpandMode="Single" where every item contains a TextBox. Is it possible to enable the user to tab between the TextBoxes?

     

    Let's say I have this GUI:

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="25" />
             <RowDefinition Height="10" />
             <RowDefinition Height="200" />
            <RowDefinition Height="10" />
            <RowDefinition Height="25" />
         </Grid.RowDefinitions>
        <TextBox Name="TextBoxA" Grid.Row="0" />
        <telerikControls:RadPanelBar Grid.Row="2" Orientation="Vertical" ExpandMode="Single" >
             <telerikControls:RadPanelBarItem Header="Test 1" IsExpanded="True" >
                 <TextBox Name="TextBoxB1" />
             </telerikControls:RadPanelBarItem>
             <telerikControls:RadPanelBarItem Header="Test 2" IsExpanded="True" >
                 <TextBox Name="TextBoxB2" />
             </telerikControls:RadPanelBarItem>
         </telerikControls:RadPanelBar>
        <TextBox Name="TextBoxC" Grid.Row="4" />
     </Grid>

     

    This is my desired behavior:

    1. The user has focus on TextBoxA.
    2. The uses presses Tab -> Focus is moved to TextBoxB1
    3. The uses presses Tab -> Focus is moved to TextBoxB2, and the corresponding PanelBarItem is expanded
    4. The uses presses Tab -> Focus is moved to TextBoxC

     

    Is this possible?

  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 07 Jan 2011 Link to this post

    Hello David Haglund,

    You can do like so:
    <Grid>
           <Grid.RowDefinitions>
               <RowDefinition Height="25" />
               <RowDefinition Height="10" />
               <RowDefinition Height="200" />
               <RowDefinition Height="10" />
               <RowDefinition Height="25" />
           </Grid.RowDefinitions>
           <TextBox Name="TextBoxA" Grid.Row="0" TabIndex="1" IsTabStop="True"/>
           <telerik:RadPanelBar Grid.Row="2" Orientation="Vertical" ExpandMode="Single" IsTabStop="False" Focusable="False">
                 
               <telerik:RadPanelBarItem Header="Test 1" IsExpanded="True" IsTabStop="False" Focusable="False">
                   <TextBox Name="TextBoxB1" TabIndex="2" IsTabStop="True"/>
               </telerik:RadPanelBarItem>
                 
               <telerik:RadPanelBarItem Header="Test 2" IsExpanded="True" IsTabStop="False" Focusable="False">
                   <TextBox Name="TextBoxB2" TabIndex="3" IsTabStop="True" />
               </telerik:RadPanelBarItem>
                 
           </telerik:RadPanelBar>
           <TextBox Name="TextBoxC" Grid.Row="4" />
       </Grid>
    Please let me know if this approach satisfies your needs. We would be glad to assist you further.

    Regards,
    Petar Mladenov
    the Telerik team
    Browse the videos here>> to help you get started with RadControls for WPF
  3. UI for WPF is Visual Studio 2017 Ready
  4. haagel
    haagel avatar
    52 posts
    Member since:
    Feb 2010

    Posted 10 Jan 2011 Link to this post

    Thanks for your reply, but I'm afraid this does not work...

    Firstly, I need the the RadPanelBar to have only one item expanded at any time. The whole purpose of using a PanelBar and not just put the TextBoxes in an ordinary StackPanel is to win some space by collapsing all of the TextBoxes but one.

    Secondly, even if I do expand all items it still doesn't work as I want it to. When I try to tab between the TextBoxes, there is still some other control taking focus in between. Let's say I have focus in the TextBox of the first item. If I press tab, the focus will go to the next item, but not to the TextBox. Instead some ContentControl gets focus (Snoop tells me that "Header (ContentControl)" has focus, and I see a dashed line around the TextBox). If I press tab again the TextBox gets focus.

    I'd really appreciate if you could help me with this, because the current user experience I'm providing is really not good enough.
  5. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 12 Jan 2011 Link to this post

    Hello David Haglund,

    It appears that IsTabStop property of the RadpanelBarItem doesn`t work as expected in WPF. I logged this in our PITS (PanelBar: IsTabStop property of the RadPanelBarItem doesn`t work in WPF) and updated your telerik points accordingly. However, you could try the approach in the attached sample although it does not fulfil all of your requirements.
    Hope this may give you a starting point. Feel free to ask if you need further assistance.

    Kind regards,
    Petar Mladenov
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
Back to Top