title: Create a Twitter Bootstrap 'nav-tabs' menu without changing the URL - Is it possible?
body: <p>I am after a <code>nav-tab</code> that does not involve the URL changing but obviously the tabs change and display the relevant information.</p>
  
  <p>I have an <code>angularjs</code> site but whenever the page refreshes it take the user back to the search page.  As the normal twitter bootstrap <code>nav-tabs</code> changes the URL I can not use this but it's something I want to do.</p>
  
  <p>Questions are:</p>
  
  <ol>
  <li>Does anyone know a way of doing this using the twitter bootstrap <code>nav-tabs</code></li>
  <li>If not, is there something else I can use which does the same</li>
  </ol>
  
  <p>Below is cut of my code:</p>
  
  <pre><code>    &lt;div class="row" data-ng-if="showcharts"&gt;
      &lt;div class="col-md-12"&gt;
          &lt;!-- Nav tabs --&gt;
          &lt;ul class="nav nav-tabs" role="tablist"&gt;
              &lt;li role="presentation" class="active"&gt;&lt;a href="#productBreakdown" role="tab" data-toggle="tab"&gt;&lt;span class="tabHeadings"&gt;Product breakdown&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li role="presentation" style="border-right: 1px solid lightgray; border-left: 1px solid lightgray"&gt;&lt;a href="#assetsBreakdown" role="tab" data-toggle="tab"&gt;&lt;span class="tabHeadings"&gt;Assets Breakdown&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li role="presentation"&gt;&lt;a href="#nbBreakdown" role="tab" data-toggle="tab"&gt;&lt;span class="tabHeadings"&gt;New Business Breakdown&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
          &lt;!-- Tab panes --&gt;
          &lt;div class="tab-content"&gt;
              &lt;div role="tabpanel" class="tab-pane active" id="productBreakdown"&gt;
                  &lt;donutchart id="product-breakdown" data-options="productbreakdownchart"&gt;&lt;/donutchart&gt;
              &lt;/div&gt;
              &lt;div role="tabpanel" class="tab-pane" id="assetsBreakdown"&gt;
                  &lt;donutchart id="asset-breakdown" data-options="assetbreakdownchart"&gt;&lt;/donutchart&gt;
              &lt;/div&gt;
              &lt;div role="tabpanel" class="tab-pane" id="messages"&gt;TO BE ADDED&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Each tab will display an informational chart to the user.</p>