title: Jquery bootstrapx clickover strange issue
body: <p>I have setup a jsfiddle <a href="http://jsfiddle.net/bababalcksheep/Wbnj2/15/" rel="nofollow">http://jsfiddle.net/bababalcksheep/Wbnj2/15/</a></p>
  
  <p>Follow steps below to get the idea of my problem.</p>
  
  <ol>
  <li>Click on + icon on "Add Fruits" <em>don't do anything yet</em></li>
  <li>Click on + icon on "Add Cars"</li>
  </ol>
  
  <p>Now add some text in input box and click OK.
  <strong>OK button stops working but why ????.</strong></p>
  
  <p>This is really annoying me.
  However it works if Click on + icon on "Add Fruits" and leave input box empty ..do nothing but press close button.</p>
  
  <p>So if I keep pressing close button each time this works.If I skip close button and click on next + button, Ok stops working until I reopen clickover and press close button.
  Any IDEAS ?</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>  &lt;div class="control-group"&gt;
      &lt;label class="control-label"&gt;Add Fruits&lt;/label&gt;
      &lt;div class="controls"&gt;
          &lt;div class="input-append"&gt;
          &lt;select id="fruits"&gt;
             &lt;option&gt;apple&lt;/option&gt;
             &lt;option&gt;ornage&lt;/option&gt;
          &lt;/select&gt;
          &lt;button data-attach="fruits " data-key="1 " rel="PERA"  class="btn " type="button"&gt;&lt;i class="icon-plus "&gt;&lt;/i&gt;&lt;/button&gt;                           
         &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="control-group"&gt;
      &lt;label class="control-label"&gt;Add cars&lt;/label&gt;
      &lt;div class="controls"&gt;
          &lt;div class="input-append"&gt;
          &lt;select id="cars"&gt;
             &lt;option&gt;suzuki&lt;/option&gt;
             &lt;option&gt;toyota&lt;/option&gt;
          &lt;/select&gt;
          &lt;button data-attach="cars " data-key="2 " rel="PERA"  class="btn " type="button"&gt;&lt;i class="icon-plus "&gt;&lt;/i&gt;&lt;/button&gt;                             
         &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JQUERY</strong></p>
  
  <pre><code> jQuery(document).ready(function ()
  {
    $('[rel*=PERA]').clickover(
    {
      html: true,
      placement: 'right',
      trigger: 'click',
      width: 350,
      title: '&lt;strong&gt;Add new&lt;/strong&gt;',
      content: '',
      allow_multiple: false,
      global_close: false,
      onShown: function ()
      {
        var myid = generateUUID();
        var content = '&lt;div id="' + myid + '"&gt;&lt;div class="row" style="margin: 10px; "&gt;&lt;input class="small m-wrap new_value" type="text" placeholder="Enter Value "/&gt;&lt;button class="btn blue update_sel" type="submit"&gt;&lt;i class="icon-ok icon-white"&gt;&lt;/i&gt;&lt;/button&gt;&lt;button class="btn editable-cancel" type="button" data-dismiss="clickover"&gt;&lt;i class="icon-remove"&gt;&lt;/i&gt;&lt;/button&gt;&lt;/div&gt;&lt;div class="rspmsg" style="clear: both"&gt; &lt;/div&gt;&lt;/div&gt;';
        $("div.clickover").find("div.popover-content").html(content);
  
        var me = $('#' + myid);
        var clickover = this;
        var base = $('#' + clickover.options.attach);
        var updatebutton = me.find("button.update_sel");
        var newvalue = me.find("input.new_value");
        var closeclickover = me.find("button.editable-cancel");
        updatebutton.click(function (event)
        {
          event.preventDefault();
          setTimeout(function ()
          {
            // heavy lifting
            base.append($("&lt;option&gt;&lt;/option&gt;").attr("value", 13).attr("selected", "selected").text(newvalue.val()));
            closeclickover.click();
          }, 100);
        });
  
      },
    });
  });
  </code></pre>
  
  <p><strong>UPDATE:</strong></p>
  
  <p>If I add clickover option  <code>onHidden: function () {alert("hiding");},</code>
  then it starts working.But If I take out alert from onhidden, it stops working again.</p>