title: Using bootstrap dropdown with Om
body: <p>This is what I have:</p>
  
  <pre><code>(defn view [cursor owner]
    (reify
      om/IDidMount
      (did-mount [_]
        (-&gt; (js/$ ".dropdown-toggle")
            (.dropdown)))
  
      om/IRender
      (render [_]
        (dom/div #js {:className "dropdown"}
                 (dom/button #js {:className "btn btn-default dropdown-toggle"
                                  :type "button"
                                  :id "dropdownMenu1"} "Dropdown" (dom/span #js {:className "caret"}))
                 (dom/ul #js {:className "dropdown-menu"
                              :role "menu"
                              :ariaLabelledby "dropdownMenu1"}
                         (dom/li #js {:role "presentation"}
                                 (dom/a #js {:role "menuitem"
                                             :tabIndex "-1"
                                             :href "#"} "Action"))
                         (dom/li #js {:role "presentation"}
                                 (dom/a #js {:role "menuitem"
                                             :tabIndex "-1"
                                             :href "#"} "Another action")))))))
  </code></pre>
  
  <p>The problem is that once the dropdown is opened, it does not hide anymore as it should be when one clicks on it or somewhere else. Also keystrokes don't work. I believe a missing something important here, what could it be? I'm using bootstrap 3.1.1 and jquery 1.11.0.</p>
  
  <p>Thanks.</p>