How do I add a click event handler to a TextBox's DeleteButton? - winrt-xaml

Question

I have a TextBox in one of my Windows Runtime app's Pages. When there is text in the TextBox, it shows a black cross which, when clicked, clears the TextBox. Apparently this is the DeleteButton from the default template, and there are loads of questions on SO about how to remove it. I don't want to remove it, but I do want to add an event handler so I know when it is clicked.
How do I add a click event handler to a TextBox's DeleteButton? I'd prefer an answer that saves me having to make a copy of the template.

Answer 1

<TextBox x:Name="TestTextBox" Loaded="TestTextBox_Loaded" Width="300" Height="100"></TextBox>
The easiest way is to use the VisualTreeHelperExtension from the WinRTXamlToolkit (or as NuGet package).
With the TreeHelper you can easy access the button:
private void TestTextBox_Loaded(object sender, RoutedEventArgs e)
{
var deleteButton = TestTextBox.GetChildByName<Button>("DeleteButton");
deleteButton.Click += deleteButton_Click;
}
void deleteButton_Click(object sender, RoutedEventArgs e)
{
throw new NotImplementedException();
}
I use this function:
public static T GetChildByName<T>(this DependencyObject parent, string childName) where T : DependencyObject
{
// Confirm parent and childName are valid.
if (parent == null) { return null; }
T foundChild = null;
int childrenCount = VisualTreeHelper.GetChildrenCount(parent);
for (int i = 0; i < childrenCount; i++)
{
DependencyObject child = VisualTreeHelper.GetChild(parent, i);
// If the child is not of the request child type child
var childType = child as T;
if (childType == null)
{
// recursively drill down the tree
foundChild = GetChildByName<T>(child, childName);
// If the child is found, break so we do not overwrite the found child.
if (foundChild != null) { break; }
}
else if (!string.IsNullOrEmpty(childName))
{
var frameworkElement = child as FrameworkElement;
// If the child's name is set for search
if (frameworkElement != null && frameworkElement.Name == childName)
{
// if the child's name is of the request name
foundChild = (T)child;
break;
}
// Need this in case the element we want is nested
// in another element of the same type
foundChild = GetChildByName<T>(child, childName);
}
else
{
// child element found.
foundChild = (T)child;
break;
}
}
return foundChild;
}