title: Merge toolbar in tabpanel ExtJs 4
body: <p>I have a tab panel with two tabs and a toolbar at the top that has two buttons that implement certain functionality on the contents of the tabs(the buttons are common to both tabs). Is there a way to place those buttons in the same panel/div as the tabs ie to the extreme right of the tabs, so as to save some real estate on the ui?
  <a href="http://i.imgur.com/Flfpj.png" rel="nofollow">http://i.imgur.com/Flfpj.png</a></p>
  
  <pre><code>title: 'Results',
  layout: { type: 'fit', align: 'stretch' },
  dockedItems: [{
      xtype: 'toolbar',
      dock: 'top',
      items: [{
                  xtype: 'tbfill' // fills left side of tbar and pushes following items to be aligned to right
              },
              {
                  xtype: 'label',
                  text: 'Export to: '
              },
              {
                  xtype: 'button',
                  text: 'Excel',
                  iconCls: 'icon-excel'
              },
              {
                  xtype:'button',
                  text:'PDF',
                  iconCls:'icon-pdf'
              }],
      style: { padding: '8px' }
  }],
   items:
      [{
      xtype: 'tabpanel',
      id: 'results-tabpanel',
      activeTab: 0,
      border: false,
      items: [{
          title: 'Results',
          id: 'result-tab',
          layout: { type: 'fit', align: 'stretch' },
          html: "Run a query to see results"
      },
          {
              title: 'Transactions',
              id: 'transactions-tab',
              layout: { type: 'fit', align: 'stretch' },
              html: "Run a query to see transactions"
          }]
  }]
  </code></pre>