title: Twitter Bootstrap tab shown event not firing on page load
body: <p>In a page where I have <em>n</em> tabs, and the following script (coffeescript, I checked the compiled javascript and it seems to be ok)...</p>
  
  <pre><code>$ -&gt;
      init()
  
  init = -&gt;
      $('a[data-toggle="tab"]').on 'shown', (event) -&gt;
          shown = event.target
          console.log("Showing tab: " + shown)
  </code></pre>
  
  <p>Now, the 'shown' event does not fire on page load, so for the first tab being shown on the page there's no way to handle this (ie: loading content via xhr)</p>
  
  <p>I tried adding this to the above script, to see if triggering it manually could work:</p>
  
  <pre><code>$('a[data-toggle="tab"]:first').tab 'show'
  </code></pre>
  
  <p>... but it didn't.</p>
  
  <p>This is the HTML code I use in my view </p>
  
  <pre><code>&lt;div class="tabbable"&gt;
  &lt;ul class="nav nav-tabs"&gt;
      &lt;li class="active"&gt;
          &lt;a href="#updates" data-toggle="tab"&gt;&lt;%=t :updates, :scope =&gt; 'user.profile.sections'%&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;
          &lt;a href="#activity" data-toggle="tab"&gt;&lt;%=t :activity, :scope =&gt; 'user.profile.sections'%&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;
          &lt;a href="#articles" data-toggle="tab"&gt;&lt;%=t :articles, :scope =&gt; 'user.profile.sections'%&gt;&lt;/a&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;div class="tab-content"&gt;
      &lt;div class="tab-pane active" id="updates"&gt;
  
      &lt;/div&gt;
      &lt;div class="tab-pane" id="activity"&gt;
  
      &lt;/div&gt;
  
      &lt;div class="tab-pane" id="articles"&gt;
  
      &lt;/div&gt;
  
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Any clue?</p>