Channels ▼


Handling Events Within Silverlight Control Templates


This works fine if the control template is placed in the same scope as the event handler code such as the page or user control resources section. However, if you try to move the template code to another resources section that doesn't have access to the event handler code (DropDownToggle_Click) you'll run into problems . What if you want to put the control template in a merged resource dictionary (similar to an external CSS stylesheet to give a web analogy) and can't hard-code the click event into the control template since you don't know where the event handler will be defined at that point? Although you can certainly write a custom control that derives from AutoCompleteBox in this case (which would be recommended if you'll re-use the control across multiple pages or user controls), another solution is to hook-up the ToggleButton's Click event when the AutoCompleteBox control first loads; see Listing Three.

void SilverlightApplication_Loaded(object sender, RoutedEventArgs e)

void HookAutoCompleteBoxEvents()
    AutoCompleteBox[] boxes = { this.JobIDAutoCompleteBox, 
      this.EmployeeAutoCompleteBox };
    foreach (var box in boxes)
        Grid grid = VisualTreeHelper.GetChild(box, 0) as Grid;
        ToggleButton tb = grid.Children[1] as ToggleButton;
        if (tb != null) tb.Click += DropDownToggle_Click;

Listing Three

When the Silverlight application Loaded event is called it calls the HookAutoCompleteBoxEvents() method. Within HookAutoCompleteBoxEvents() an array of AutoCompleteBox controls is iterated through to locate the ToggleButton for each control and attach a Click event handler to it. Doing this avoids hard-coding the event handler in the control template so that it can be defined just about anywhere you'd like without running into code scoping issues.

If you plan on using the customized AutoCompleteBox control in several places it may be worth the time to create a custom control that derives from AutoCompleteBox to avoid having to put the ToggleButton event handler code and the HookAutoCompleteBoxEvents code into each page or user control.

Related Reading

More Insights

Currently we allow the following HTML tags in comments:

Single tags

These tags can be used alone and don't need an ending tag.

<br> Defines a single line break

<hr> Defines a horizontal line

Matching tags

These require an ending tag - e.g. <i>italic text</i>

<a> Defines an anchor

<b> Defines bold text

<big> Defines big text

<blockquote> Defines a long quotation

<caption> Defines a table caption

<cite> Defines a citation

<code> Defines computer code text

<em> Defines emphasized text

<fieldset> Defines a border around elements in a form

<h1> This is heading 1

<h2> This is heading 2

<h3> This is heading 3

<h4> This is heading 4

<h5> This is heading 5

<h6> This is heading 6

<i> Defines italic text

<p> Defines a paragraph

<pre> Defines preformatted text

<q> Defines a short quotation

<samp> Defines sample computer code text

<small> Defines small text

<span> Defines a section in a document

<s> Defines strikethrough text

<strike> Defines strikethrough text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscripted text

<u> Defines underlined text

Dr. Dobb's encourages readers to engage in spirited, healthy debate, including taking us to task. However, Dr. Dobb's moderates all comments posted to our site, and reserves the right to modify or remove any content that it determines to be derogatory, offensive, inflammatory, vulgar, irrelevant/off-topic, racist or obvious marketing or spam. Dr. Dobb's further reserves the right to disable the profile of any commenter participating in said activities.

Disqus Tips To upload an avatar photo, first complete your Disqus profile. | View the list of supported HTML tags you can use to style comments. | Please read our commenting policy.