How to clear a TextBox in MVVM? - wpf

Question

I have a TextBox in a DataTemplate declared as follows:
<TextBox Grid.Row="1" Grid.Column="1" Margin="0,4,0,0">
<i:Interaction.Triggers>
<i:EventTrigger EventName="LostFocus">
<cmd:EventToCommand Command="{Binding DataContext.NotesEnteredCommand,
RelativeSource={RelativeSource FindAncestor, AncestorType=Window}}">
<cmd:EventToCommand.CommandParameter>
<MultiBinding Converter="{StaticResource SimpleMultiValueConverter}">
<Binding Path="Row.OID" />
<Binding Path="Text" RelativeSource="{RelativeSource FindAncestor, AncestorType=TextBox}" />
</MultiBinding>
</cmd:EventToCommand.CommandParameter>
</cmd:EventToCommand>
</i:EventTrigger>
</i:Interaction.Triggers>
<TextBox.InputBindings>
<KeyBinding Key="Enter" Command="{Binding DataContext.NotesEnteredCommand, RelativeSource={RelativeSource FindAncestor, AncestorType=Window}}">
<KeyBinding.CommandParameter>
<MultiBinding Converter="{StaticResource SimpleMultiValueConverter}">
<Binding Path="Row.OID" />
<Binding Path="Text" RelativeSource="{RelativeSource FindAncestor, AncestorType=TextBox}" />
</MultiBinding>
</KeyBinding.CommandParameter>
</KeyBinding>
</TextBox.InputBindings>
What this TextBox basically does is execute a MVVM-Light RelayCommand when the Enter key is pressed or when losing focus.
My problem is that I cannot figure out a way in MVVM to clear the TextBox's Text value through XAML in the above two scenarios. It's very easy with in code-behind, but I can't figure it out in MVVM.
Any ideas?

Answer 1

If the text is part of your data layer and application logic, a string should exist in your Model or ViewModel and be cleared from there
For example,
<TextBox Text="{Binding NewNote}" ... />
and
void NotesEntered(int oid)
{
SaveNewNote(oid);
NewNote = string.Empty;
}
If it's part of the UI layer only, it should just be cleared with code-behind. It's perfectly acceptable to have UI-specific logic in the code-behind the UI, as that still maintains the separation of layers.
NewNoteTextBox_LostFocus(object sender, EventArgs e)
{
(sender as TextBox).Text = string.Empty;
}
NewNoteTextBox_KeyDown(object sender, KeyEventArgs e)
{
if (e.Key == Keys.Enter)
(sender as TextBox).Text = string.Empty;
}

Answer 2

You can use a UpdateSourceHelper. This really helped me out calling an event with no code-behind.
See here http://www.wiredprairie.us/blog/index.php/archives/1701
All you have to do is create a class "UpdateSourceHelper", connect it with your xaml like this
xmlns:local="using:WiredPrairie.Converter
and bind it to your TextBox (or whatever you want to bind to)...
<TextBox Height="Auto" Margin="0,6" Grid.Row="1" TextWrapping="Wrap" TabIndex="0"
Text="{Binding Value}"
local:UpdateSourceHelper.IsEnabled="True"
local:UpdateSourceHelper.UpdateSourceText="{Binding Value, Mode=TwoWay}"/>
If you want call LostFocus Event in the Helper, you simply have to add these 2 lines in your Helper:
tb.LostFocus += AttachedTextBoxLostFocus;
tb.LostFocus -= AttachedTextBoxLostFocus;
So it would look like this:
TextBox tb = (TextBox)obj;
if ((bool)args.NewValue)
{
tb.LostFocus += AttachedTextBoxLostFocus;
}
else
{
tb.LostFocus -= AttachedTextBoxLostFocus;
}
Right click on AttachedTextBoxLostFocus and generate the method. Now you can handle the Event like a code-behind event.