title: bootbox.confirm opens and closes immediately when in ajax loaded div
body: <p>I am using bootbox which I downloaded from <a href="http://bootboxjs.com/" rel="nofollow noreferrer">http://bootboxjs.com/</a>.
  user_update.php is loaded in a div in users.php with ajax.
  In user_update.php I have a JavaScript function <code>validateForm()</code>, and below in the same document I have the form which calls this function like so:</p>
  <pre><code>&lt;form name= &quot;updateForm&quot; onsubmit=&quot;return validateForm()&quot; role=&quot;form-horizontal&quot; method=&quot;post&quot; action=&quot;index.php&quot;&gt;
  </code></pre>
  <p>The function bootbox.alert works just fine.</p>
  <p>When I use <code>bootbox.confirm</code> I see the dialog opening and closing within a few tenths of a second.</p>
  <pre><code>if (roleid != prevroleid) {
      bootbox.confirm(&quot;Are you sure?&quot;, function (result) {
          if (result) {
              console.log(&quot;User confirmed dialog&quot;);
          } else {
              console.log(&quot;User declined dialog&quot;);
          }
      });
  }
  </code></pre>
  <p>When I test the same function in a div that is not loaded in a div with ajax, then <code>bootbox.confirm</code> works as expected.</p>
  <p>EDITED<br />
  this is the ajax call:</p>
  <pre><code>$(document).on(&quot;click&quot;, &quot;.gebruiker&quot;, function (e) {
      e.preventDefault();
      //var url = &quot;user_update.php&quot;;
      //$(&quot;#details&quot;).load(url)
      var idnr = $(this).attr('idnr');
  
      $.ajax({
          type: &quot;get&quot;,
          url: &quot;view/user_update.php&quot;,
          data: {
              variable1: idnr
          },
          success: function (data) {
              //do stuff after the AJAX calls successfully completes
              $('#details').html(data);
  
          }
      });
  });
  </code></pre>
  <p>this is the div it gets loaded in:</p>
  <pre><code>&lt;div id=&quot;details&quot; class=&quot;col-md-6&quot;&gt;         
  &lt;/div&gt;
  </code></pre>
  <p>added at 16:43<br />
  ValidateFormcode as requested:</p>
  <pre><code>&lt;script&gt;
      function validateForm()
      {
          var fullname = $('#fullname').val();
          var username = $('#username').val();
          var role = document.getElementById(&quot;role&quot;);
          var roleid = role.options[role.selectedIndex].value;
  
          var password1 = $('#password1').val();
          var password2 = $('#password2').val();
          var prevroleid = $('#prevroleid').val();
        
        
          if (roleid != prevroleid) {
  bootbox.confirm(&quot;Are you sure?&quot;, function (result) {
      if (result) {
          console.log(&quot;User confirmed dialog&quot;);
      } else {
          console.log(&quot;User declined dialog&quot;);
      }
  });
  }    
  
          
          if (!fullname)
          {
          bootbox.alert(&quot;Het veld 'Naam' mag niet leeg zijn&quot;)
          return false;
        }
        if (!username)
          {
          bootbox.alert(&quot;Het veld 'Gebruikersnaam' mag niet leeg zijn&quot;)
          return false;
        }
        
        if(password1 != password2)
        {
          bootbox.alert(&quot;De waardes in de wachtwoord velden komen niet overeen&quot;)
          return false;
        }
        
       
      }       
  &lt;/script&gt;
  </code></pre>