title: Set Jquery ui active tab on page load/reload
body: <p>I'm using a basic implementation of Jquery UI Tabs that are working fine but I want to set (or reset) the active tab dynamically based on a user action. </p>
  
  <ol>
  <li><p>How can I set the active tab based on a querystring value?  With my previous tab solution I was able to pass a querystring value and set the active tab when the page loaded.  (I had to abandon this older solution due to other technical challenges.)</p></li>
  <li><p>When the user selects the Save button in my browser application, and the browser page reloads, how can I maintain focus on the tab they were on before they pressed save?</p></li>
  <li><p>How can I set the active tab when a user returns to the Tasks page of my browser application?  For example, all within my web application, if the user browses to the Projects page and then returns to the Task page, how can I reset the tab they were previously on?</p></li>
  </ol>
  
  <p>Javascript:</p>
  
  <pre><code>$(function() {
     $("#tabs").tabs();
  });
  </code></pre>
  
  <p>HTML Example code:</p>
  
  <pre><code>&lt;div id="tabs"&gt;
      &lt;ul&gt;
          &lt;li&gt;&lt;a href="#tabs-1"&gt;Description&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#tabs-2"&gt;Action&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#tabs-3"&gt;Resources&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#tabs-4"&gt;Settings&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  
  &lt;div id="tabs-1"&gt;
      &lt;p&gt;Description content&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div id="tabs-2"&gt;
      &lt;p&gt;Action content&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div id="tabs-3"&gt;
      &lt;p&gt;Resources content&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div id="tabs-4"&gt;
      &lt;p&gt;Settings &lt;/p&gt;
  &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>