--- /dev/null
+<html>
+<head>
+ <title>The source code</title>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body onload="prettyPrint();">
+ <pre class="prettyprint lang-js">Ext.namespace('Ext.ux.menu');\r
+\r
+<div id="cls-Ext.ux.menu.ListMenu"></div>/** \r
+ * @class Ext.ux.menu.ListMenu\r
+ * @extends Ext.menu.Menu\r
+ * This is a supporting class for {@link Ext.ux.grid.filter.ListFilter}.\r
+ * Although not listed as configuration options for this class, this class\r
+ * also accepts all configuration options from {@link Ext.ux.grid.filter.ListFilter}.\r
+ */\r
+Ext.ux.menu.ListMenu = Ext.extend(Ext.menu.Menu, {\r
+ <div id="cfg-Ext.ux.menu.ListMenu-labelField"></div>/**\r
+ * @cfg {String} labelField\r
+ * Defaults to 'text'.\r
+ */\r
+ labelField : 'text',\r
+ <div id="cfg-Ext.ux.menu.ListMenu-paramPrefix"></div>/**\r
+ * @cfg {String} paramPrefix\r
+ * Defaults to 'Loading...'.\r
+ */\r
+ loadingText : 'Loading...',\r
+ <div id="cfg-Ext.ux.menu.ListMenu-loadOnShow"></div>/**\r
+ * @cfg {Boolean} loadOnShow\r
+ * Defaults to true.\r
+ */\r
+ loadOnShow : true,\r
+ <div id="cfg-Ext.ux.menu.ListMenu-single"></div>/**\r
+ * @cfg {Boolean} single\r
+ * Specify true to group all items in this list into a single-select\r
+ * radio button group. Defaults to false.\r
+ */\r
+ single : false,\r
+\r
+ constructor : function (cfg) {\r
+ this.selected = [];\r
+ this.addEvents(\r
+ <div id="event-Ext.ux.menu.ListMenu-checkchange"></div>/**\r
+ * @event checkchange\r
+ * Fires when there is a change in checked items from this list\r
+ * @param {Object} item Ext.menu.CheckItem\r
+ * @param {Object} checked The checked value that was set\r
+ */\r
+ 'checkchange'\r
+ );\r
+ \r
+ Ext.ux.menu.ListMenu.superclass.constructor.call(this, cfg = cfg || {});\r
+ \r
+ if(!cfg.store && cfg.options){\r
+ var options = [];\r
+ for(var i=0, len=cfg.options.length; i<len; i++){\r
+ var value = cfg.options[i];\r
+ switch(Ext.type(value)){\r
+ case 'array': options.push(value); break;\r
+ case 'object': options.push([value.id, value[this.labelField]]); break;\r
+ case 'string': options.push([value, value]); break;\r
+ }\r
+ }\r
+ \r
+ this.store = new Ext.data.Store({\r
+ reader: new Ext.data.ArrayReader({id: 0}, ['id', this.labelField]),\r
+ data: options,\r
+ listeners: {\r
+ 'load': this.onLoad,\r
+ scope: this\r
+ }\r
+ });\r
+ this.loaded = true;\r
+ } else {\r
+ this.add({text: this.loadingText, iconCls: 'loading-indicator'});\r
+ this.store.on('load', this.onLoad, this);\r
+ }\r
+ },\r
+\r
+ destroy : function () {\r
+ if (this.store) {\r
+ this.store.destroy(); \r
+ }\r
+ Ext.ux.menu.ListMenu.superclass.destroy.call(this);\r
+ },\r
+\r
+ <div id="method-Ext.ux.menu.ListMenu-show"></div>/**\r
+ * Lists will initially show a 'loading' item while the data is retrieved from the store.\r
+ * In some cases the loaded data will result in a list that goes off the screen to the\r
+ * right (as placement calculations were done with the loading item). This adapter will\r
+ * allow show to be called with no arguments to show with the previous arguments and\r
+ * thus recalculate the width and potentially hang the menu from the left.\r
+ */\r
+ show : function () {\r
+ var lastArgs = null;\r
+ return function(){\r
+ if(arguments.length === 0){\r
+ Ext.ux.menu.ListMenu.superclass.show.apply(this, lastArgs);\r
+ } else {\r
+ lastArgs = arguments;\r
+ if (this.loadOnShow && !this.loaded) {\r
+ this.store.load();\r
+ }\r
+ Ext.ux.menu.ListMenu.superclass.show.apply(this, arguments);\r
+ }\r
+ };\r
+ }(),\r
+ \r
+ /** @private */\r
+ onLoad : function (store, records) {\r
+ var visible = this.isVisible();\r
+ this.hide(false);\r
+ \r
+ this.removeAll(true);\r
+ \r
+ var gid = this.single ? Ext.id() : null;\r
+ for(var i=0, len=records.length; i<len; i++){\r
+ var item = new Ext.menu.CheckItem({\r
+ text: records[i].get(this.labelField), \r
+ group: gid,\r
+ checked: this.selected.indexOf(records[i].id) > -1,\r
+ hideOnClick: false});\r
+ \r
+ item.itemId = records[i].id;\r
+ item.on('checkchange', this.checkChange, this);\r
+ \r
+ this.add(item);\r
+ }\r
+ \r
+ this.loaded = true;\r
+ \r
+ if (visible) {\r
+ this.show();\r
+ } \r
+ this.fireEvent('load', this, records);\r
+ },\r
+\r
+ <div id="method-Ext.ux.menu.ListMenu-getSelected"></div>/**\r
+ * Get the selected items.\r
+ * @return {Array} selected\r
+ */\r
+ getSelected : function () {\r
+ return this.selected;\r
+ },\r
+ \r
+ /** @private */\r
+ setSelected : function (value) {\r
+ value = this.selected = [].concat(value);\r
+\r
+ if (this.loaded) {\r
+ this.items.each(function(item){\r
+ item.setChecked(false, true);\r
+ for (var i = 0, len = value.length; i < len; i++) {\r
+ if (item.itemId == value[i]) {\r
+ item.setChecked(true, true);\r
+ }\r
+ }\r
+ }, this);\r
+ }\r
+ },\r
+ \r
+ <div id="method-Ext.ux.menu.ListMenu-checkChange"></div>/**\r
+ * Handler for the 'checkchange' event from an check item in this menu\r
+ * @param {Object} item Ext.menu.CheckItem\r
+ * @param {Object} checked The checked value that was set\r
+ */\r
+ checkChange : function (item, checked) {\r
+ var value = [];\r
+ this.items.each(function(item){\r
+ if (item.checked) {\r
+ value.push(item.itemId);\r
+ }\r
+ },this);\r
+ this.selected = value;\r
+ \r
+ this.fireEvent('checkchange', item, checked);\r
+ } \r
+});</pre>
+</body>
+</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff