title: WPF: button inside MenuItem, closing the menu
body: <p>I've got a Button inside a MenuItem's header. Clicking the menu item (not the Button part) closes the menu as expected, but clicking the Button <em>doesn't</em> close the menu, and I want it to. How can I fix this?</p>
  <p>More background:</p>
  <p>I have two commands that are minor variants of each other, and I want to put them both in a menu. The first variant will be used most of the time, so I don't really want two menu items both taking up space, nor do I want to put them both in a submenu. So I hit on the idea of putting a Button for the secondary command <em>inside</em> the MenuItem, like so:</p>
  <pre><code>&lt;Menu&gt;
    &lt;MenuItem Header=&quot;Git&quot;&gt;
      &lt;MenuItem Command=&quot;{Binding PrimaryCommand}&quot;&gt;
        &lt;MenuItem.Header&gt;
          &lt;StackPanel Orientation=&quot;Horizontal&quot;&gt;
            &lt;TextBlock VerticalAlignment=&quot;Center&quot; Text=&quot;Rebase &quot;/&gt;
            &lt;Button Content=&quot;Interactive&quot; Focusable=&quot;False&quot;
                    Command=&quot;{Binding SecondaryCommand}&quot;/&gt;
          &lt;/StackPanel&gt;
        &lt;/MenuItem.Header&gt;
      &lt;/MenuItem&gt;
    &lt;/MenuItem&gt;
  &lt;/Menu&gt;
  </code></pre>
  <p>which looks like this:</p>
  <p><a href="https://i.stack.imgur.com/DoOGM.png" rel="noreferrer"><img src="https://i.stack.imgur.com/DoOGM.png" alt="" /></a><br />
  <sub>(source: <a href="http://www.excastle.com/misc/wpf-menuitem-with-button.png" rel="noreferrer">excastle.com</a>)</sub></p>
  <p>So if I click on the button, I'll get the secondary command; but if I click anywhere else on the menu item, I'll get the primary command. This works well, up to a point.</p>
  <p>The problem is, whether I'm clicking on the MenuItem or on the Button, I've made my selection and I want the menu to close -- but if I click the button, it doesn't close the menu. The menu stays open. I can see this actually being useful behavior in some cases (e.g. zoom in/out buttons that you might want to click multiple times without closing the menu after each click, as in Google Chrome's menu); but in this case I <em>do</em> want the button to close the menu.</p>
  <p>In case anyone wonders about that <code>Focusable=&quot;False&quot;</code>, removing it doesn't fix the problem, it just changes it so the Button draws with a blue (focused) border the second time you drop the menu down.</p>
  <p>I've tried using a Hyperlink instead of a Button, with the same effect: clicking the Hyperlink doesn't close the menu.</p>
  <p><strong>How can I get the embedded button to close the menu?</strong></p>