Textbox in popup doesn't get focus in WPF application

Question

I'm building a window for a kiosk application that has an admin screen to connect to a wifi network. Actually, I'm porting an existing WinForms app that already does this, but doesn't give us the flexibility we want to create a more interesting UI. So, we're moving to WPF.

The window is pretty straightforward, it has a listview to show networks that it finds, and if you click on one, it will connect to it. In order to connect, we need to prompt for the security code for that network if it needs one. To do this, we open a popup that has three sections - a "dialog-y" prompt section at the top, a spacer row, and a blank border that will sit behind an onscreen keyboard, but have nice rounded corners.

That top section has a header, a text box, and two buttons, connect and cancel. Again, nothing complex.

All this works. You click a network, we show the popup and the keyboard, except: the textbox for the passcode never gets the focus. Even if you click on it. No focus. The only trick I've found to get it to focus is to click off the popup (like back on the listview, which is already ignoring clicks if the popup is open, so it's safe), then click back on the textbox, and voila! focus. I really don't think I want to put that in a user manual though.

Here's the popup portion of the xaml:

<Popup x:Name="popPasscode" Placement="Top" HorizontalOffset="50" VerticalOffset="1000" AllowsTransparency="True" >
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="50" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Border Grid.Row="0"  Background="White" CornerRadius="20" Width="600" Height="400">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Border Grid.Row="0" Background="#464646" Height="50" Margin="8,10,8,0" CornerRadius="25" >
                    <Label x:Name="lblTitleSecurityCode" Content="Enter the security code" Foreground="White" FontFamily="Arial" FontSize="30" FontWeight="Bold" HorizontalAlignment="Center"/>
                </Border>
                <TextBox Grid.Row="1" x:Name="tbPasscode" Height="50" FontFamily="Arial" FontSize="30" Margin="40,0,40,0"/>
                <StackPanel Grid.Row="2" Orientation="Horizontal" Margin="10,0,10,10" HorizontalAlignment="Center">
                    <Controls:ImageButton x:Name="btnCodeConnect" Content="Connect" Height="70" Width="275" Foreground="Black" Style="{DynamicResource PlainButton}" FontFamily="Arial" FontSize="30" FontWeight="Bold" Click="btnCodeConnect_Click"  HorizontalAlignment="Center" VerticalAlignment="Center"  />
                    <Controls:ImageButton  x:Name="btnCodeCancel" Content="Cancel" Height="70"  Width="275" Foreground="Black" Style="{DynamicResource PlainButton}" FontFamily="Arial" FontSize="30" FontWeight="Bold" Click="btnCodeCancel_Click"  HorizontalAlignment="Center" VerticalAlignment="Center"  />
                </StackPanel>
            </Grid>
        </Border>
        <Border Grid.Row="2" x:Name="brdrKbd" Background="White" CornerRadius="20" Width="1200" Height="420"/>
    </Grid>
</Popup>

Here's what I'm currently trying to do during the listview click event to get focus to the control. Note that I tried to fake the "set focus to the listview, then set it to the textbox, but that didn't work.

// set the popup location and width and keyboard border width based on the current screen width
popPasscode.IsOpen = true;
// open the on-screen keyboard - synchronous call, doesn't return until it's open and idle
FocusManager.SetFocusedElement(this, lvAvailNetworks);
tbPasscode.Focusable = true;
FocusManager.SetFocusedElement(popPasscode, tbPasscode);

I've tried a couple different things for the DependencyElement for tbPasscode, but I really have no idea what I'm doing, or that what I'm doing is making any difference. Oh, did I mention I just finished my first week of WPF coding? Yup, WPF newbie alert.

I saw this post , but it didn't help much, since I thought I was already doing all that.

Answer 1

Instead of MouseDown , register to MouseUp event on ListView/ListViewItem . In the handler you can do

     popPasscode.IsOpen = true;
     Keyboard.Focus(tbPasscode);

The MouseUp on your ListView takes focus away from the Popup , so open your Popup in MouseUp instead of MouseDown