title: Calling a function on Bootstrap modal open
body: <p>I used to use jQuery UI's dialog, and it had the <code>open</code> option, where you can specify some Javascript code to execute once the dialog is opened. I would have used that option to select the text within the dialog using a function I have.</p>
  <p>Now I want to do that using bootstrap's modal. Below is the HTMl code:</p>
  <pre><code>&lt;div id=&quot;code&quot; class=&quot;modal hide fade&quot;&gt;
      &lt;div class=&quot;modal-header&quot;&gt;
          &lt;button type=&quot;button&quot; class=&quot;close&quot; data-dismiss=&quot;modal&quot; aria-hidden=&quot;true&quot;&gt;&amp;times;&lt;/button&gt;
          &lt;h3&gt;Modal header&lt;/h3&gt;
      &lt;/div&gt;
      &lt;div class=&quot;modal-body&quot;&gt;
          &lt;pre&gt;
  print 'Hello World'
  </code></pre>
  
          
      
  <p>And as for the button that opens the modal:</p>
  <pre><code> &lt;a href=&quot;#code&quot; data-toggle=&quot;modal&quot; class=&quot;btn code-dialog&quot;&gt;Display code&lt;/a&gt;
  </code></pre>
  <p>I tried to use an onclick listener of the button, but the alert message was displayed <em>before</em> the modal appeared:</p>
  <pre><code>$( &quot;.code-dialog&quot; ).click(function(){
      alert(&quot;I want this to appear after the modal has opened!&quot;);
  });
  </code></pre>