Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>You can make use of the "hash". This is the portion of the URL which follows the "#" character.</p> <p>If you only need to react to the hash at time of page load to support the bookmarking feature then you can get away with something like:</p> <pre><code>Ext.onReady(function() { var tabPanel = new Ext.TabPanel({ // Configure for use in viewport as needed. listeners: { tabchange: function( tabPanel, tab ) { window.location.hash = '#'+ tab.itemId; } } }); var token = window.location.hash.substr(1); if ( token ) { var tab = tabPanel.get(token); if ( ! tab ) { // Create tab or error as necessary. tab = new Ext.Panel({ itemId: token, title: 'Tab: '+ token }); tabPanel.add(tab); } tabPanel.setActiveTab(tab); } }); </code></pre> <p>You may also choose to go further and employ the hashchange event supported in recent versions of most browsers. This will allow you to react to the hash being changed by either user or programmatic means after the page has finished loading:</p> <pre><code>if ( 'onhashchange' in window ) { window.onhashchange = function() { var token = window.location.hash.substr(1); // Handle tab creation and activation as above. } } </code></pre> <p>It is worth noting that the Ext.History singleton promises functionality similar to this. However, as of ExtJS 3.3.1 it has not been given support for the hashchange event and is instead wholly dependent on a polling interval and a hidden iframe hack. I was not satisfied with its performance in modern browsers - IE in particular - until I rewrote it to use hashchange where available.</p>
 

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