/*!
- * Ext JS Library 3.0.0
+ * Ext JS Library 3.0.3
* Copyright(c) 2006-2009 Ext JS, LLC
* licensing@extjs.com
* http://www.extjs.com/license
clearMenu : function(){\r
var m = this.moreMenu;\r
if(m && m.items){\r
- this.moreMenu.items.each(function(item){\r
+ m.items.each(function(item){\r
delete item.menu;\r
});\r
}\r
scope: this\r
}\r
});\r
+ this.moreMenu.ownerCt = this.container;\r
this.more = new Ext.Button({\r
iconCls: 'x-toolbar-more-icon',\r
cls: 'x-toolbar-more',\r
\r
defaultType: 'button',\r
\r
+ /**\r
+ * @cfg {String/Object} layout\r
+ * This class assigns a default layout (<code>layout:'<b>toolbar</b>'</code>).\r
+ * Developers <i>may</i> override this configuration option if another layout\r
+ * is required (the constructor must be passed a configuration object in this\r
+ * case instead of an array).\r
+ * See {@link Ext.Container#layout} for additional information.\r
+ */\r
+\r
trackMenus : true,\r
internalDefaults: {removeMode: 'container', hideParent: true},\r
toolbarCls: 'x-toolbar',\r
};\r
}\r
this.el = ct.createChild(Ext.apply({ id: this.id },this.autoCreate), position);\r
+ Ext.Toolbar.superclass.onRender.apply(this, arguments);\r
}\r
},\r
\r
/**\r
- * Adds element(s) to the toolbar -- this function takes a variable number of\r
- * arguments of mixed type and adds them to the toolbar.\r
+ * <p>Adds element(s) to the toolbar -- this function takes a variable number of\r
+ * arguments of mixed type and adds them to the toolbar.</p>\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Mixed} arg1 The following types of arguments are all valid:<br />\r
* <ul>\r
* <li>{@link Ext.Button} config: A valid button config object (equivalent to {@link #addButton})</li>\r
\r
/**\r
* Adds a separator\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @return {Ext.Toolbar.Item} The separator {@link Ext.Toolbar.Item item}\r
*/\r
addSeparator : function(){\r
\r
/**\r
* Adds a spacer element\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @return {Ext.Toolbar.Spacer} The spacer item\r
*/\r
addSpacer : function(){\r
\r
/**\r
* Forces subsequent additions into the float:right toolbar\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
*/\r
addFill : function(){\r
this.add(new T.Fill());\r
\r
/**\r
* Adds any standard HTML element to the toolbar\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Mixed} el The element or id of the element to add\r
* @return {Ext.Toolbar.Item} The element's item\r
*/\r
\r
/**\r
* Adds any Toolbar.Item or subclass\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Ext.Toolbar.Item} item\r
* @return {Ext.Toolbar.Item} The item\r
*/\r
addItem : function(item){\r
- return Ext.Toolbar.superclass.add.apply(this, arguments);\r
+ return this.add.apply(this, arguments);\r
},\r
\r
/**\r
* Adds a button (or buttons). See {@link Ext.Button} for more info on the config.\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Object/Array} config A button config or array of configs\r
* @return {Ext.Button/Array}\r
*/\r
\r
/**\r
* Adds text to the toolbar\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {String} text The text to add\r
* @return {Ext.Toolbar.Item} The element's item\r
*/\r
\r
/**\r
* Adds a new element to the toolbar from the passed {@link Ext.DomHelper} config\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Object} config\r
* @return {Ext.Toolbar.Item} The element's item\r
*/\r
/**\r
* Adds a dynamically rendered Ext.form field (TextField, ComboBox, etc). Note: the field should not have\r
* been rendered yet. For a field that has already been rendered, use {@link #addElement}.\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Ext.form.Field} field\r
* @return {Ext.Toolbar.Item}\r
*/\r
\r
/**\r
* Inserts any {@link Ext.Toolbar.Item}/{@link Ext.Button} at the specified index.\r
+ * <br><p><b>Note</b>: See the notes within {@link Ext.Container#add}.</p>\r
* @param {Number} index The index where the item is to be inserted\r
* @param {Object/Ext.Toolbar.Item/Ext.Button/Array} item The button, or button config object to be\r
* inserted, or an array of buttons/configs.\r
* @xtype tbtext\r
*/\r
T.TextItem = Ext.extend(T.Item, {\r
+ /**\r
+ * @cfg {String} text The text to be used as innerHTML (html tags are accepted)\r
+ */ \r
+\r
constructor: function(config){\r
- if (Ext.isString(config)) {\r
- config = { autoEl: {cls: 'xtb-text', html: config }};\r
- } else {\r
- config.autoEl = {cls: 'xtb-text', html: config.text || ''};\r
- }\r
- T.TextItem.superclass.constructor.call(this, config);\r
+ T.TextItem.superclass.constructor.call(this, Ext.isString(config) ? {text: config} : config);\r
},\r
+ \r
+ // private\r
+ onRender : function(ct, position) {\r
+ this.autoEl = {cls: 'xtb-text', html: this.text || ''};\r
+ T.TextItem.superclass.onRender.call(this, ct, position);\r
+ },\r
+ \r
/**\r
* Updates this item's text, setting the text to be used as innerHTML.\r
* @param {String} t The text to display (html accepted).\r
*/\r
setText : function(t) {\r
- if (this.rendered) {\r
- this.el.dom.innerHTML = t;\r
- } else {\r
- this.autoEl.html = t;\r
+ if(this.rendered){\r
+ this.el.update(t);\r
+ }else{\r
+ this.text = t;\r
}\r
}\r
});\r
Ext.QuickTips.init(); // to display button quicktips
var myStore = new Ext.data.Store({
+ reader: new Ext.data.JsonReader({
+ {@link Ext.data.JsonReader#totalProperty totalProperty}: 'results',
+ ...
+ }),
...
});
-var myPageSize = 25; // server script should only send back 25 items
+var myPageSize = 25; // server script should only send back 25 items at a time
var grid = new Ext.grid.GridPanel({
...
* <pre><code>
store.load({
params: {
- start: 0, // specify params for the first page load if using paging
+ // specify params for the first page load if using paging
+ start: 0,
limit: myPageSize,
+ // other params
foo: 'bar'
}
});
+ * </code></pre>
+ *
+ * <p>If using {@link Ext.data.Store#autoLoad store's autoLoad} configuration:</p>
+ * <pre><code>
+var myStore = new Ext.data.Store({
+ {@link Ext.data.Store#autoLoad autoLoad}: {params:{start: 0, limit: 25}},
+ ...
+});
+ * </code></pre>
+ *
+ * <p>The packet sent back from the server would have this form:</p>
+ * <pre><code>
+{
+ "success": true,
+ "results": 2000,
+ "rows": [ // <b>*Note:</b> this must be an Array
+ { "id": 1, "name": "Bill", "occupation": "Gardener" },
+ { "id": 2, "name": "Ben", "occupation": "Horticulturalist" },
+ ...
+ { "id": 25, "name": "Sue", "occupation": "Botanist" }
+ ]
+}
* </code></pre>
* <p><u>Paging with Local Data</u></p>
* <p>Paging can also be accomplished with local data using extensions:</p>
* <div class="mdetail-params"><ul>
- * <li><a href="http://extjs.com/forum/showthread.php?t=57386">Ext.ux.data.PagingStore</a></li>
+ * <li><a href="http://extjs.com/forum/showthread.php?t=71532">Ext.ux.data.PagingStore</a></li>
* <li>Paging Memory Proxy (examples/ux/PagingMemoryProxy.js)</li>
* </ul></div>
- * @constructor
- * Create a new PagingToolbar
+ * @constructor Create a new PagingToolbar
* @param {Object} config The config object
* @xtype paging
*/
refreshText : 'Refresh',
/**
- * @deprecated
- * <b>The defaults for these should be set in the data store.</b>
- * Object mapping of parameter names used for load calls, initially set to:
+ * <p><b>Deprecated</b>. <code>paramNames</code> should be set in the <b>data store</b>
+ * (see {@link Ext.data.Store#paramNames}).</p>
+ * <br><p>Object mapping of parameter names used for load calls, initially set to:</p>
* <pre>{start: 'start', limit: 'limit'}</pre>
+ * @type Object
+ * @property paramNames
+ * @deprecated
*/
/**
tooltip: this.refreshText,
overflowText: this.refreshText,
iconCls: 'x-tbar-loading',
- handler: this.refresh,
+ handler: this.doRefresh,
scope: this
})];
);
this.on('afterlayout', this.onFirstLayout, this, {single: true});
this.cursor = 0;
- this.bindStore(this.store);
+ this.bindStore(this.store, true);
},
// private
return this.paramNames || this.store.paramNames;
},
+ // private
+ getParams : function(){
+ //retain backwards compat, allow params on the toolbar itself, if they exist.
+ return this.paramNames || this.store.paramNames;
+ },
+
// private
beforeLoad : function(){
if(this.rendered && this.refresh){
/**
* Refresh the current page, has the same effect as clicking the 'refresh' button.
*/
- refresh : function(){
+ doRefresh : function(){
this.doLoad(this.cursor);
},
bindStore : function(store, initial){
var doLoad;
if(!initial && this.store){
- this.store.un('beforeload', this.beforeLoad, this);
- this.store.un('load', this.onLoad, this);
- this.store.un('exception', this.onLoadError, this);
if(store !== this.store && this.store.autoDestroy){
this.store.destroy();
+ }else{
+ this.store.un('beforeload', this.beforeLoad, this);
+ this.store.un('load', this.onLoad, this);
+ this.store.un('exception', this.onLoadError, this);
+ }
+ if(!store){
+ this.store = null;
}
}
if(store){
load: this.onLoad,
exception: this.onLoadError
});
- doLoad = store.getCount() > 0;
+ doLoad = true;
}
this.store = store;
if(doLoad){