How to Focus on a textbox by Click on the label just in XAML WPF

Question

Here is what I want : I want to focus on that textbox when the user clicks on the label next to the text box , also I have to use this event "PreviewMouseLeftButtonUp" for label

enter image description here

What have I tried :

    <Window.Resources>
    <Storyboard x:Key="OnLabelCLick">
        <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="FocusManager.FocusedElement" Storyboard.TargetName="text22">
            <DiscreteBooleanKeyFrame KeyTime="0" Value="True"/>
        </BooleanAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>

<Window.Triggers>
    <EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonUp" SourceName="LBL1">
        <BeginStoryboard Storyboard="{StaticResource OnLabelCLick}"/>
    </EventTrigger>
</Window.Triggers>

<Grid>
    <Label Content="Label"  x:Name="LBL1"  HorizontalAlignment="Left" Margin="210,200,0,0" VerticalAlignment="Top" Height="95" Width="370" Cursor="Hand" Background="#FF1B1B1C" Foreground="White"/>
    <TextBox x:Name="text22" HorizontalAlignment="Left" Height="70" Margin="210,85,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="360" RenderTransformOrigin="0.5,0.5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center">
    </TextBox>
</Grid>

But I see this Error

when I click on the label :

System.InvalidOperationException: 'Cannot resolve all property references in the property path 'FocusManager.FocusedElement'. Verify that applicable objects support the properties.'

I want to do all thing only in XAML

How can I do that ?

Please help

Reference : Set focus on textbox in WPF

to fix this error you should write like this: (FocusManager.FocusedElement) — Mumtozbekov, Feb 02 '22 at 10:55

Ohad Cohen · Answer 1 · 2022-02-02T10:08:31.820

You can add the event - LBL1_OnPreviewMouseLeftButtonDown

And do so:

       <Label Content="Label"  
           x:Name="LBL1"  
           HorizontalAlignment="Left" 
           Margin="210,200,0,0" 
           VerticalAlignment="Top" 
           Height="95" Width="370" 
           Cursor="Hand" 
           Background="#FF1B1B1C" 
           Foreground="White"
           PreviewMouseLeftButtonUp="LBL1_OnPreviewMouseLeftButtonUp"
           PreviewMouseLeftButtonDown="LBL1_OnPreviewMouseLeftButtonDown"/>

  private void LBL1_OnPreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        text22.Focus();
    }

Sir Rufo · Accepted Answer · 2022-02-02T13:13:10.013

You can use an AttachedProperty for this

using System.Windows;
using System.Windows.Controls;

namespace WpfApp4.Extensions // may be different in your application!
{
    public class FocusHandling : DependencyObject
    {
        public static Control GetFocusControl(Label obj)
        {
            return (Control)obj.GetValue(FocusControlProperty);
        }

        public static void SetFocusControl(Label obj, Control value)
        {
            obj.SetValue(FocusControlProperty, value);
        }

        // Using a DependencyProperty as the backing store for FocusControl.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty FocusControlProperty =
            DependencyProperty.RegisterAttached("FocusControl", typeof(Control), typeof(FocusHandling), new PropertyMetadata(null, FocusControlChanged));

        private static void FocusControlChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            if (d is Label label)
            {
                if (e.OldValue is not null && e.NewValue is null)
                    label.MouseLeftButtonUp -= Label_MouseLeftButtonUp;
                if (e.OldValue is null && e.NewValue is not null)
                    label.MouseLeftButtonUp += Label_MouseLeftButtonUp;
            }
        }

        private static void Label_MouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
        {
            if (sender is Label label)
            {
                var focusControl = GetFocusControl(label);
                if (focusControl.Focusable)
                    focusControl.Focus();
            }
        }
    }
}

and in your XAML

<Window
  ...
  xmlns:extensions="clr-namespace:WpfApp4.Extensions" <!-- may be different in your application -->
  ...>

  <Grid>
    <Label

      extensions:FocusHandling.FocusControl="{x:Reference text22}"

      x:Name="LBL1"
      Width="370"
      Height="95"
      Margin="210,200,0,0"
      HorizontalAlignment="Left"
      VerticalAlignment="Top"
      Background="#FF1B1B1C"
      Content="Label"
      Cursor="Hand"
      Foreground="White" />
    <TextBox
      x:Name="text22"
      Width="360"
      Height="70"
      Margin="210,85,0,0"
      HorizontalAlignment="Left"
      VerticalAlignment="Top"
      HorizontalContentAlignment="Center"
      VerticalContentAlignment="Center"
      RenderTransformOrigin="0.5,0.5"
      Text="TextBox"
      TextWrapping="Wrap" />
  </Grid>
</Window>

thanks but "FocusHandling " bot recognized in XAML for xmlns:extensions="clr-namespace:WpfApp5" ?! — , Feb 02 '22 at 12:29
It depends where you put that class in your namespace ... I updated the answer for you. I hope you can see how the namespace and the xmlns entry are related — Sir Rufo, Feb 02 '22 at 13:13
Thank you very much . Can you provide a link to teach these codes? — , Feb 02 '22 at 17:02
You should start at https://learn.microsoft.com/en-us/dotnet/desktop/wpf/properties/attached-properties-overview?view=netdesktop-6.0 and then you can ask your favorite search engine :o) — Sir Rufo, Feb 02 '22 at 17:28

How to Focus on a textbox by Click on the label just in XAML WPF

2 Answers2