X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/25ef3491bd9ae007ff1fc2b0d7943e6eaaccf775..6e39d509471fe9b4e2660e0d1631b350d0c66f40:/docs/output/Ext.Toolbar.html diff --git a/docs/output/Ext.Toolbar.html b/docs/output/Ext.Toolbar.html index 1d1876e2..ddb98566 100644 --- a/docs/output/Ext.Toolbar.html +++ b/docs/output/Ext.Toolbar.html @@ -1,87 +1,87 @@ -
Properties Methods Events Config Options Direct Link 
Observable
  Component
    BoxComponent
      Container
        Toolbar

Class Ext.Toolbar

Package:Ext
Defined In:Toolbar.js
Class:Toolbar
Subclasses:PagingToolbar, StatusBar
Extends:Container
xtype:toolbar

Basic Toolbar class. Although the defaultType for Toolbar -is button, Toolbar elements (child items for the Toolbar container) may -be virtually any type of Component. Toolbar elements can be created explicitly via their constructors, -or implicitly via their xtypes, and can be added dynamically.

-

Some items have shortcut strings for creation:

-
-Shortcut  xtype          Class                  Description
-'->'      'tbfill'       Ext.Toolbar.Fill       begin using the right-justified button container
-'-'       'tbseparator'  Ext.Toolbar.Separator  add a vertical separator bar between toolbar items
-' '       'tbspacer'     Ext.Toolbar.Spacer     add horiztonal space between elements
-
-Example usage of various elements: -
var tb = new Ext.Toolbar({
-    renderTo: document.body,
-    width: 600,
-    height: 100,
-    items: [
-        {
-            // xtype: 'button', // default for Toolbars, same as 'tbbutton'

-            text: 'Button'
-        },
-        {
-            xtype: 'splitbutton', // same as 'tbsplitbutton'

-            text: 'Split Button'
-        },
-        // begin using the right-justified button container

-        '->', // same as {xtype: 'tbfill'}, // Ext.Toolbar.Fill

-        {
-            xtype: 'textfield',
-            name: 'field1',
-            emptyText: 'enter search term'
-        },
-        // add a vertical separator bar between toolbar items

-        '-', // same as {xtype: 'tbseparator'} to create Ext.Toolbar.Separator

-        'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.Toolbar.TextItem

-        {xtype: 'tbspacer'},// same as ' ' to create Ext.Toolbar.Spacer

-        'text 2',
-        {xtype: 'tbspacer', width: 50}, // add a 50px space

-        'text 3'
-    ]
-});
-Example adding a ComboBox within a menu of a button: -
// ComboBox creation

-var combo = new Ext.form.ComboBox({
-    store: new Ext.data.ArrayStore({
-        autoDestroy: true,
-        fields: ['initials', 'fullname'],
-        data : [
-            ['FF', 'Fred Flintstone'],
-            ['BR', 'Barney Rubble']
-        ]
-    }),
-    displayField: 'fullname',
-    typeAhead: true,
-    mode: 'local',
-    forceSelection: true,
-    triggerAction: 'all',
-    emptyText: 'Select a name...',
-    selectOnFocus: true,
-    width: 135,
-    getListParent: function() {
-        return this.el.up('.x-menu');
-    },
-    iconCls: 'no-icon' //use iconCls if placing within menu to shift to right side of menu

-});
-
-// put ComboBox in a Menu

-var menu = new Ext.menu.Menu({
-    id: 'mainMenu',
-    items: [
-        combo // A Field in a Menu

-    ]
-});
-
-// add a Button with the menu

-tb.add({
-        text:'Button w/ Menu',
-        menu: menu  // assign menu by instance

-    });
-tb.doLayout();

Config Options

Config OptionsDefined By