Note that there are some explanatory texts on larger screens.

plurals
  1. POloading new page in tabs using twitter bootstrap
    primarykey
    data
    text
    <p>Hi I am using the following code to create tabbed layout using twitter bootstrap</p> <pre><code>&lt;ul class="nav nav-tabs" &gt; &lt;li class="active"&gt;&lt;a href="#" data-toggle="tab"&gt;Request Audit&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#" data-toggle="tab"&gt;status&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#" data-toggle="tab"&gt;Settings&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#" data-toggle="tab"&gt;Help&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; </code></pre> <p>now in all tabs i need different page to load.So i want to do this :</p> <pre><code>&lt;ul class="nav nav-tabs" &gt; &lt;li class="active"&gt;&lt;a href="#" data-toggle="tab"&gt;Home&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="status.html" data-toggle="tab"&gt;status&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="settings.html" data-toggle="tab"&gt;Settings&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="help.html" data-toggle="tab"&gt;Help&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; </code></pre> <p>I don't want to load the content from same page in all tabs and above code is not loading new page.Please help..</p> <p>update :</p> <pre><code>&lt;ul class="nav nav-tabs" id="myTab"&gt; &lt;li class="active"&gt;&lt;a href="#audit"&gt;Request Audit&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#status"&gt;status&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#settings"&gt;Settings&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#help"&gt;Help&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;div class="tab-content"&gt; &lt;div class="tab-pane active" id="audit"&gt; &lt;p&gt;audit&lt;/p&gt; &lt;/div&gt; &lt;div class="tab-pane" id="status"&gt; &lt;p&gt;status&lt;/p&gt; &lt;/div&gt; &lt;div class="tab-pane" id="settings"&gt; &lt;p&gt;settings&lt;/p&gt; &lt;/div&gt; &lt;div class="tab-pane" id="help"&gt; &lt;p&gt;help&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>I have added this script</p> <pre><code>&lt;script&gt; $('#myTab a[href="#status"]').click(function (e) { e.preventDefault(); $(this).tab('show'); $('#status').load('status.html'); }); &lt;/script&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload