Upgrade to ExtJS 3.1.1 - Released 02/08/2010
[extjs.git] / examples / ux / ux-all-debug.js
index 0a52e43..5849630 100644 (file)
@@ -1,6 +1,6 @@
 /*!
 /*!
- * Ext JS Library 3.1.0
- * Copyright(c) 2006-2009 Ext JS, LLC
+ * Ext JS Library 3.1.1
+ * Copyright(c) 2006-2010 Ext JS, LLC
  * licensing@extjs.com
  * http://www.extjs.com/license
  */
  * licensing@extjs.com
  * http://www.extjs.com/license
  */
@@ -328,7 +328,7 @@ Ext.ux.grid.CheckColumn.prototype ={
     },\r
 \r
     onMouseDown : function(e, t){\r
     },\r
 \r
     onMouseDown : function(e, t){\r
-        if(t.className && t.className.indexOf('x-grid3-cc-'+this.id) != -1){\r
+        if(Ext.fly(t).hasClass(this.createId())){\r
             e.stopEvent();\r
             var index = this.grid.getView().findRowIndex(t);\r
             var record = this.grid.store.getAt(index);\r
             e.stopEvent();\r
             var index = this.grid.getView().findRowIndex(t);\r
             var record = this.grid.store.getAt(index);\r
@@ -338,7 +338,11 @@ Ext.ux.grid.CheckColumn.prototype ={
 \r
     renderer : function(v, p, record){\r
         p.css += ' x-grid3-check-col-td'; \r
 \r
     renderer : function(v, p, record){\r
         p.css += ' x-grid3-check-col-td'; \r
-        return '<div class="x-grid3-check-col'+(v?'-on':'')+' x-grid3-cc-'+this.id+'">&#160;</div>';\r
+        return String.format('<div class="x-grid3-check-col{0} {1}">&#160;</div>', v ? '-on' : '', this.createId());\r
+    },\r
+    \r
+    createId : function(){\r
+        return 'x-grid3-cc-' + this.id;\r
     }\r
 };\r
 \r
     }\r
 };\r
 \r
@@ -348,10 +352,6 @@ Ext.preg('checkcolumn', Ext.ux.grid.CheckColumn);
 // backwards compat\r
 Ext.grid.CheckColumn = Ext.ux.grid.CheckColumn;Ext.ns('Ext.ux.grid');\r
 \r
 // backwards compat\r
 Ext.grid.CheckColumn = Ext.ux.grid.CheckColumn;Ext.ns('Ext.ux.grid');\r
 \r
-if(Ext.isWebKit){\r
-    Ext.grid.GridView.prototype.borderWidth = 0;\r
-}\r
-\r
 Ext.ux.grid.ColumnHeaderGroup = Ext.extend(Ext.util.Observable, {\r
 \r
     constructor: function(config){\r
 Ext.ux.grid.ColumnHeaderGroup = Ext.extend(Ext.util.Observable, {\r
 \r
     constructor: function(config){\r
@@ -720,7 +720,7 @@ Ext.ux.grid.ColumnHeaderGroup = Ext.extend(Ext.util.Observable, {
             }\r
         }\r
         return {\r
             }\r
         }\r
         return {\r
-            width: (Ext.isBorderBox ? width : Math.max(width - this.borderWidth, 0)) + 'px',\r
+            width: (Ext.isBorderBox || (Ext.isWebKit && !Ext.isSafari2) ? width : Math.max(width - this.borderWidth, 0)) + 'px',\r
             hidden: hidden\r
         };\r
     },\r
             hidden: hidden\r
         };\r
     },\r
@@ -800,8 +800,8 @@ Ext.ux.grid.ColumnHeaderGroup = Ext.extend(Ext.util.Observable, {
         if(cm.isFixed(newIndex)){\r
             return false;\r
         }\r
         if(cm.isFixed(newIndex)){\r
             return false;\r
         }\r
-        var row = Ext.ux.grid.ColumnHeaderGroup.prototype.getGroupRowIndex.call(this.view, h), \r
-            oldGroup = Ext.ux.grid.ColumnHeaderGroup.prototype.getGroupSpan.call(this.view, row, oldIndex), \r
+        var row = Ext.ux.grid.ColumnHeaderGroup.prototype.getGroupRowIndex.call(this.view, h),\r
+            oldGroup = Ext.ux.grid.ColumnHeaderGroup.prototype.getGroupSpan.call(this.view, row, oldIndex),\r
             newGroup = Ext.ux.grid.ColumnHeaderGroup.prototype.getGroupSpan.call(this.view, row, newIndex),\r
             oldIndex = oldGroup.col;\r
             newIndex = newGroup.col + (pt == "after" ? newGroup.colspan : 0);\r
             newGroup = Ext.ux.grid.ColumnHeaderGroup.prototype.getGroupSpan.call(this.view, row, newIndex),\r
             oldIndex = oldGroup.col;\r
             newIndex = newGroup.col + (pt == "after" ? newGroup.colspan : 0);\r
@@ -1502,7 +1502,7 @@ Ext.reg('gmappanel', Ext.ux.GMapPanel); Ext.namespace('Ext.ux.grid');
  * The filter collection binds to the\r
  * <code>{@link Ext.grid.GridPanel#beforestaterestore beforestaterestore}</code>\r
  * and <code>{@link Ext.grid.GridPanel#beforestatesave beforestatesave}</code>\r
  * The filter collection binds to the\r
  * <code>{@link Ext.grid.GridPanel#beforestaterestore beforestaterestore}</code>\r
  * and <code>{@link Ext.grid.GridPanel#beforestatesave beforestatesave}</code>\r
- * events in order to be stateful. \r
+ * events in order to be stateful.\r
  * </div></li>\r
  * <li><b>Grid Changes</b> :\r
  * <div class="sub-desc"><ul>\r
  * </div></li>\r
  * <li><b>Grid Changes</b> :\r
  * <div class="sub-desc"><ul>\r
@@ -1521,11 +1521,11 @@ Ext.reg('gmappanel', Ext.ux.GMapPanel); Ext.namespace('Ext.ux.grid');
  * </ul></div></li>\r
  * </ul></div>\r
  * <p><b><u>Example usage:</u></b></p>\r
  * </ul></div></li>\r
  * </ul></div>\r
  * <p><b><u>Example usage:</u></b></p>\r
- * <pre><code>    \r
+ * <pre><code>\r
 var store = new Ext.data.GroupingStore({\r
     ...\r
 });\r
 var store = new Ext.data.GroupingStore({\r
     ...\r
 });\r
\r
+\r
 var filters = new Ext.ux.grid.GridFilters({\r
     autoReload: false, //don&#39;t reload automatically\r
     local: true, //only filter locally\r
 var filters = new Ext.ux.grid.GridFilters({\r
     autoReload: false, //don&#39;t reload automatically\r
     local: true, //only filter locally\r
@@ -1556,7 +1556,7 @@ var filters = new Ext.ux.grid.GridFilters({
 var cm = new Ext.grid.ColumnModel([{\r
     ...\r
 }]);\r
 var cm = new Ext.grid.ColumnModel([{\r
     ...\r
 }]);\r
\r
+\r
 var grid = new Ext.grid.GridPanel({\r
      ds: store,\r
      cm: cm,\r
 var grid = new Ext.grid.GridPanel({\r
      ds: store,\r
      cm: cm,\r
@@ -1654,17 +1654,17 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
     init : function (grid) {\r
         if (grid instanceof Ext.grid.GridPanel) {\r
             this.grid = grid;\r
     init : function (grid) {\r
         if (grid instanceof Ext.grid.GridPanel) {\r
             this.grid = grid;\r
-            \r
+\r
             this.bindStore(this.grid.getStore(), true);\r
             // assumes no filters were passed in the constructor, so try and use ones from the colModel\r
             if(this.filters.getCount() == 0){\r
                 this.addFilters(this.grid.getColumnModel());\r
             }\r
             this.bindStore(this.grid.getStore(), true);\r
             // assumes no filters were passed in the constructor, so try and use ones from the colModel\r
             if(this.filters.getCount() == 0){\r
                 this.addFilters(this.grid.getColumnModel());\r
             }\r
-          \r
+\r
             this.grid.filters = this;\r
             this.grid.filters = this;\r
-             \r
+\r
             this.grid.addEvents({'filterupdate': true});\r
             this.grid.addEvents({'filterupdate': true});\r
-              \r
+\r
             grid.on({\r
                 scope: this,\r
                 beforestaterestore: this.applyState,\r
             grid.on({\r
                 scope: this,\r
                 beforestaterestore: this.applyState,\r
@@ -1672,7 +1672,7 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
                 beforedestroy: this.destroy,\r
                 reconfigure: this.onReconfigure\r
             });\r
                 beforedestroy: this.destroy,\r
                 reconfigure: this.onReconfigure\r
             });\r
-            \r
+\r
             if (grid.rendered){\r
                 this.onRender();\r
             } else {\r
             if (grid.rendered){\r
                 this.onRender();\r
             } else {\r
@@ -1682,19 +1682,19 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
                     render: this.onRender\r
                 });\r
             }\r
                     render: this.onRender\r
                 });\r
             }\r
-                      \r
+\r
         } else if (grid instanceof Ext.PagingToolbar) {\r
             this.toolbar = grid;\r
         }\r
     },\r
         } else if (grid instanceof Ext.PagingToolbar) {\r
             this.toolbar = grid;\r
         }\r
     },\r
-        \r
+\r
     /**\r
      * @private\r
      * Handler for the grid's beforestaterestore event (fires before the state of the\r
      * grid is restored).\r
      * @param {Object} grid The grid object\r
      * @param {Object} state The hash of state values returned from the StateProvider.\r
     /**\r
      * @private\r
      * Handler for the grid's beforestaterestore event (fires before the state of the\r
      * grid is restored).\r
      * @param {Object} grid The grid object\r
      * @param {Object} state The hash of state values returned from the StateProvider.\r
-     */   \r
+     */\r
     applyState : function (grid, state) {\r
         var key, filter;\r
         this.applyingState = true;\r
     applyState : function (grid, state) {\r
         var key, filter;\r
         this.applyingState = true;\r
@@ -1714,7 +1714,7 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
         }\r
         delete this.applyingState;\r
     },\r
         }\r
         delete this.applyingState;\r
     },\r
-    \r
+\r
     /**\r
      * Saves the state of all active filters\r
      * @param {Object} grid\r
     /**\r
      * Saves the state of all active filters\r
      * @param {Object} grid\r
@@ -1730,11 +1730,11 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
         });\r
         return (state.filters = filters);\r
     },\r
         });\r
         return (state.filters = filters);\r
     },\r
-    \r
+\r
     /**\r
      * @private\r
      * Handler called when the grid is rendered\r
     /**\r
      * @private\r
      * Handler called when the grid is rendered\r
-     */    \r
+     */\r
     onRender : function () {\r
         this.grid.getView().on('refresh', this.onRefresh, this);\r
         this.createMenu();\r
     onRender : function () {\r
         this.grid.getView().on('refresh', this.onRefresh, this);\r
         this.createMenu();\r
@@ -1743,7 +1743,7 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
     /**\r
      * @private\r
      * Handler called by the grid 'beforedestroy' event\r
     /**\r
      * @private\r
      * Handler called by the grid 'beforedestroy' event\r
-     */    \r
+     */\r
     destroy : function () {\r
         this.removeAll();\r
         this.purgeListeners();\r
     destroy : function () {\r
         this.removeAll();\r
         this.purgeListeners();\r
@@ -1751,17 +1751,17 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
         if(this.filterMenu){\r
             Ext.menu.MenuMgr.unregister(this.filterMenu);\r
             this.filterMenu.destroy();\r
         if(this.filterMenu){\r
             Ext.menu.MenuMgr.unregister(this.filterMenu);\r
             this.filterMenu.destroy();\r
-             this.filterMenu = this.menu.menu = null;            \r
+             this.filterMenu = this.menu.menu = null;\r
         }\r
     },\r
 \r
     /**\r
      * Remove all filters, permanently destroying them.\r
         }\r
     },\r
 \r
     /**\r
      * Remove all filters, permanently destroying them.\r
-     */    \r
+     */\r
     removeAll : function () {\r
         if(this.filters){\r
             Ext.destroy.apply(Ext, this.filters.items);\r
     removeAll : function () {\r
         if(this.filters){\r
             Ext.destroy.apply(Ext, this.filters.items);\r
-            // remove all items from the collection \r
+            // remove all items from the collection\r
             this.filters.clear();\r
         }\r
     },\r
             this.filters.clear();\r
         }\r
     },\r
@@ -1792,7 +1792,7 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
     /**\r
      * @private\r
      * Handler called when the grid reconfigure event fires\r
     /**\r
      * @private\r
      * Handler called when the grid reconfigure event fires\r
-     */    \r
+     */\r
     onReconfigure : function () {\r
         this.bindStore(this.grid.getStore());\r
         this.store.clearFilter();\r
     onReconfigure : function () {\r
         this.bindStore(this.grid.getStore());\r
         this.store.clearFilter();\r
@@ -1806,11 +1806,11 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
             hmenu = view.hmenu;\r
 \r
         if (this.showMenu && hmenu) {\r
             hmenu = view.hmenu;\r
 \r
         if (this.showMenu && hmenu) {\r
-            \r
+\r
             this.sep  = hmenu.addSeparator();\r
             this.filterMenu = new Ext.menu.Menu({\r
                 id: this.grid.id + '-filters-menu'\r
             this.sep  = hmenu.addSeparator();\r
             this.filterMenu = new Ext.menu.Menu({\r
                 id: this.grid.id + '-filters-menu'\r
-            }); \r
+            });\r
             this.menu = hmenu.add({\r
                 checked: false,\r
                 itemId: 'filters',\r
             this.menu = hmenu.add({\r
                 checked: false,\r
                 itemId: 'filters',\r
@@ -1845,12 +1845,12 @@ Ext.ux.grid.GridFilters = Ext.extend(Ext.util.Observable, {
     /**\r
      * @private\r
      * Handler called by the grid's hmenu beforeshow event\r
     /**\r
      * @private\r
      * Handler called by the grid's hmenu beforeshow event\r
-     */    \r
+     */\r
     onMenu : function (filterMenu) {\r
         var filter = this.getMenuFilter();\r
 \r
         if (filter) {\r
     onMenu : function (filterMenu) {\r
         var filter = this.getMenuFilter();\r
 \r
         if (filter) {\r
-/*            \r
+/*\r
 TODO: lazy rendering\r
             if (!filter.menu) {\r
                 filter.menu = filter.createMenu();\r
 TODO: lazy rendering\r
             if (!filter.menu) {\r
                 filter.menu = filter.createMenu();\r
@@ -1861,16 +1861,16 @@ TODO: lazy rendering
             // disable the menu if filter.disabled explicitly set to true\r
             this.menu.setDisabled(filter.disabled === true);\r
         }\r
             // disable the menu if filter.disabled explicitly set to true\r
             this.menu.setDisabled(filter.disabled === true);\r
         }\r
-        \r
+\r
         this.menu.setVisible(filter !== undefined);\r
         this.sep.setVisible(filter !== undefined);\r
     },\r
         this.menu.setVisible(filter !== undefined);\r
         this.sep.setVisible(filter !== undefined);\r
     },\r
-    \r
+\r
     /** @private */\r
     onCheckChange : function (item, value) {\r
         this.getMenuFilter().setActive(value);\r
     },\r
     /** @private */\r
     onCheckChange : function (item, value) {\r
         this.getMenuFilter().setActive(value);\r
     },\r
-    \r
+\r
     /** @private */\r
     onBeforeCheck : function (check, value) {\r
         return !value || this.getMenuFilter().isActivatable();\r
     /** @private */\r
     onBeforeCheck : function (check, value) {\r
         return !value || this.getMenuFilter().isActivatable();\r
@@ -1881,7 +1881,7 @@ TODO: lazy rendering
      * Handler for all events on filters.\r
      * @param {String} event Event name\r
      * @param {Object} filter Standard signature of the event before the event is fired\r
      * Handler for all events on filters.\r
      * @param {String} event Event name\r
      * @param {Object} filter Standard signature of the event before the event is fired\r
-     */   \r
+     */\r
     onStateChange : function (event, filter) {\r
         if (event === 'serialize') {\r
             return;\r
     onStateChange : function (event, filter) {\r
         if (event === 'serialize') {\r
             return;\r
@@ -1895,13 +1895,13 @@ TODO: lazy rendering
             this.deferredUpdate.delay(this.updateBuffer);\r
         }\r
         this.updateColumnHeadings();\r
             this.deferredUpdate.delay(this.updateBuffer);\r
         }\r
         this.updateColumnHeadings();\r
-            \r
+\r
         if (!this.applyingState) {\r
             this.grid.saveState();\r
         if (!this.applyingState) {\r
             this.grid.saveState();\r
-        }    \r
+        }\r
         this.grid.fireEvent('filterupdate', this, filter);\r
     },\r
         this.grid.fireEvent('filterupdate', this, filter);\r
     },\r
-    \r
+\r
     /**\r
      * @private\r
      * Handler for store's beforeload event when configured for remote filtering\r
     /**\r
      * @private\r
      * Handler for store's beforeload event when configured for remote filtering\r
@@ -1910,11 +1910,11 @@ TODO: lazy rendering
      */\r
     onBeforeLoad : function (store, options) {\r
         options.params = options.params || {};\r
      */\r
     onBeforeLoad : function (store, options) {\r
         options.params = options.params || {};\r
-        this.cleanParams(options.params);       \r
+        this.cleanParams(options.params);\r
         var params = this.buildQuery(this.getFilterData());\r
         Ext.apply(options.params, params);\r
     },\r
         var params = this.buildQuery(this.getFilterData());\r
         Ext.apply(options.params, params);\r
     },\r
-    \r
+\r
     /**\r
      * @private\r
      * Handler for store's load event when configured for local filtering\r
     /**\r
      * @private\r
      * Handler for store's load event when configured for local filtering\r
@@ -1928,28 +1928,25 @@ TODO: lazy rendering
     /**\r
      * @private\r
      * Handler called when the grid's view is refreshed\r
     /**\r
      * @private\r
      * Handler called when the grid's view is refreshed\r
-     */    \r
+     */\r
     onRefresh : function () {\r
         this.updateColumnHeadings();\r
     },\r
 \r
     /**\r
      * Update the styles for the header row based on the active filters\r
     onRefresh : function () {\r
         this.updateColumnHeadings();\r
     },\r
 \r
     /**\r
      * Update the styles for the header row based on the active filters\r
-     */    \r
+     */\r
     updateColumnHeadings : function () {\r
         var view = this.grid.getView(),\r
     updateColumnHeadings : function () {\r
         var view = this.grid.getView(),\r
-            hds, i, len, filter;\r
+            i, len, filter;\r
         if (view.mainHd) {\r
         if (view.mainHd) {\r
-            hds = view.mainHd.select('td').removeClass(this.filterCls);\r
             for (i = 0, len = view.cm.config.length; i < len; i++) {\r
                 filter = this.getFilter(view.cm.config[i].dataIndex);\r
             for (i = 0, len = view.cm.config.length; i < len; i++) {\r
                 filter = this.getFilter(view.cm.config[i].dataIndex);\r
-                if (filter && filter.active) {\r
-                    hds.item(i).addClass(this.filterCls);\r
-                }\r
+                Ext.fly(view.getHeaderCell(i))[filter && filter.active ? 'addClass' : 'removeClass'](this.filterCls);\r
             }\r
         }\r
     },\r
             }\r
         }\r
     },\r
-    \r
+\r
     /** @private */\r
     reload : function () {\r
         if (this.local) {\r
     /** @private */\r
     reload : function () {\r
         if (this.local) {\r
@@ -1968,7 +1965,7 @@ TODO: lazy rendering
             store.reload();\r
         }\r
     },\r
             store.reload();\r
         }\r
     },\r
-    \r
+\r
     /**\r
      * Method factory that generates a record validator for the filters active at the time\r
      * of invokation.\r
     /**\r
      * Method factory that generates a record validator for the filters active at the time\r
      * of invokation.\r
@@ -1981,7 +1978,7 @@ TODO: lazy rendering
                 f.push(filter);\r
             }\r
         });\r
                 f.push(filter);\r
             }\r
         });\r
-        \r
+\r
         len = f.length;\r
         return function (record) {\r
             for (i = 0; i < len; i++) {\r
         len = f.length;\r
         return function (record) {\r
             for (i = 0; i < len; i++) {\r
@@ -1992,7 +1989,7 @@ TODO: lazy rendering
             return true;\r
         };\r
     },\r
             return true;\r
         };\r
     },\r
-    \r
+\r
     /**\r
      * Adds a filter to the collection and observes it for state change.\r
      * @param {Object/Ext.ux.grid.filter.Filter} config A filter configuration or a filter object.\r
     /**\r
      * Adds a filter to the collection and observes it for state change.\r
      * @param {Object/Ext.ux.grid.filter.Filter} config A filter configuration or a filter object.\r
@@ -2002,7 +1999,7 @@ TODO: lazy rendering
         var Cls = this.getFilterClass(config.type),\r
             filter = config.menu ? config : (new Cls(config));\r
         this.filters.add(filter);\r
         var Cls = this.getFilterClass(config.type),\r
             filter = config.menu ? config : (new Cls(config));\r
         this.filters.add(filter);\r
-        \r
+\r
         Ext.util.Observable.capture(filter, this.onStateChange, this);\r
         return filter;\r
     },\r
         Ext.util.Observable.capture(filter, this.onStateChange, this);\r
         return filter;\r
     },\r
@@ -2012,7 +2009,7 @@ TODO: lazy rendering
      * @param {Array/Ext.grid.ColumnModel} filters Either an Array of\r
      * filter configuration objects or an Ext.grid.ColumnModel.  The columns\r
      * of a passed Ext.grid.ColumnModel will be examined for a <code>filter</code>\r
      * @param {Array/Ext.grid.ColumnModel} filters Either an Array of\r
      * filter configuration objects or an Ext.grid.ColumnModel.  The columns\r
      * of a passed Ext.grid.ColumnModel will be examined for a <code>filter</code>\r
-     * property and, if present, will be used as the filter configuration object.   \r
+     * property and, if present, will be used as the filter configuration object.\r
      */\r
     addFilters : function (filters) {\r
         if (filters) {\r
      */\r
     addFilters : function (filters) {\r
         if (filters) {\r
@@ -2032,19 +2029,19 @@ TODO: lazy rendering
                         // filter type is specified in order of preference:\r
                         //     filter type specified in config\r
                         //     type specified in store's field's type config\r
                         // filter type is specified in order of preference:\r
                         //     filter type specified in config\r
                         //     type specified in store's field's type config\r
-                        filter.type = filter.type || this.store.fields.get(dI).type;  \r
+                        filter.type = filter.type || this.store.fields.get(dI).type;\r
                     }\r
                 } else {\r
                     filter = filters[i];\r
                 }\r
                     }\r
                 } else {\r
                     filter = filters[i];\r
                 }\r
-                // if filter config found add filter for the column \r
+                // if filter config found add filter for the column\r
                 if (filter) {\r
                     this.addFilter(filter);\r
                 }\r
             }\r
         }\r
     },\r
                 if (filter) {\r
                     this.addFilter(filter);\r
                 }\r
             }\r
         }\r
     },\r
-    \r
+\r
     /**\r
      * Returns a filter for the given dataIndex, if one exists.\r
      * @param {String} dataIndex The dataIndex of the desired filter object.\r
     /**\r
      * Returns a filter for the given dataIndex, if one exists.\r
      * @param {String} dataIndex The dataIndex of the desired filter object.\r
@@ -2084,13 +2081,13 @@ TODO: lazy rendering
         });\r
         return filters;\r
     },\r
         });\r
         return filters;\r
     },\r
-    \r
+\r
     /**\r
      * Function to take the active filters data and build it into a query.\r
      * The format of the query depends on the <code>{@link #encode}</code>\r
      * configuration:\r
      * <div class="mdetail-params"><ul>\r
     /**\r
      * Function to take the active filters data and build it into a query.\r
      * The format of the query depends on the <code>{@link #encode}</code>\r
      * configuration:\r
      * <div class="mdetail-params"><ul>\r
-     * \r
+     *\r
      * <li><b><tt>false</tt></b> : <i>Default</i>\r
      * <div class="sub-desc">\r
      * Flatten into query string of the form (assuming <code>{@link #paramPrefix}='filters'</code>:\r
      * <li><b><tt>false</tt></b> : <i>Default</i>\r
      * <div class="sub-desc">\r
      * Flatten into query string of the form (assuming <code>{@link #paramPrefix}='filters'</code>:\r
@@ -2101,7 +2098,7 @@ filters[0][data][type]="someValue2"&
 filters[0][data][value]="someValue3"&\r
      * </code></pre>\r
      * </div></li>\r
 filters[0][data][value]="someValue3"&\r
      * </code></pre>\r
      * </div></li>\r
-     * <li><b><tt>true</tt></b> : \r
+     * <li><b><tt>true</tt></b> :\r
      * <div class="sub-desc">\r
      * JSON encode the filter data\r
      * <pre><code>\r
      * <div class="sub-desc">\r
      * JSON encode the filter data\r
      * <pre><code>\r
@@ -2127,7 +2124,7 @@ filters[0][data][value]="someValue3"&
                 f = filters[i];\r
                 root = [this.paramPrefix, '[', i, ']'].join('');\r
                 p[root + '[field]'] = f.field;\r
                 f = filters[i];\r
                 root = [this.paramPrefix, '[', i, ']'].join('');\r
                 p[root + '[field]'] = f.field;\r
-                \r
+\r
                 dataPrefix = root + '[data]';\r
                 for (key in f.data) {\r
                     p[[dataPrefix, '[', key, ']'].join('')] = f.data[key];\r
                 dataPrefix = root + '[data]';\r
                 for (key in f.data) {\r
                     p[[dataPrefix, '[', key, ']'].join('')] = f.data[key];\r
@@ -2143,14 +2140,14 @@ filters[0][data][value]="someValue3"&
                     f.data\r
                 ));\r
             }\r
                     f.data\r
                 ));\r
             }\r
-            // only build if there is active filter \r
+            // only build if there is active filter\r
             if (tmp.length > 0){\r
                 p[this.paramPrefix] = Ext.util.JSON.encode(tmp);\r
             }\r
         }\r
         return p;\r
     },\r
             if (tmp.length > 0){\r
                 p[this.paramPrefix] = Ext.util.JSON.encode(tmp);\r
             }\r
         }\r
         return p;\r
     },\r
-    \r
+\r
     /**\r
      * Removes filter related query parameters from the provided object.\r
      * @param {Object} p Query parameters that may contain filter related fields.\r
     /**\r
      * Removes filter related query parameters from the provided object.\r
      * @param {Object} p Query parameters that may contain filter related fields.\r
@@ -2170,13 +2167,13 @@ filters[0][data][value]="someValue3"&
             }\r
         }\r
     },\r
             }\r
         }\r
     },\r
-    \r
+\r
     /**\r
      * Function for locating filter classes, overwrite this with your favorite\r
      * loader to provide dynamic filter loading.\r
      * @param {String} type The type of filter to load ('Filter' is automatically\r
      * appended to the passed type; eg, 'string' becomes 'StringFilter').\r
     /**\r
      * Function for locating filter classes, overwrite this with your favorite\r
      * loader to provide dynamic filter loading.\r
      * @param {String} type The type of filter to load ('Filter' is automatically\r
      * appended to the passed type; eg, 'string' becomes 'StringFilter').\r
-     * @return {Class} The Ext.ux.grid.filter.Class \r
+     * @return {Class} The Ext.ux.grid.filter.Class\r
      */\r
     getFilterClass : function (type) {\r
         // map the supported Ext.data.Field type values into a supported filter\r
      */\r
     getFilterClass : function (type) {\r
         // map the supported Ext.data.Field type values into a supported filter\r
@@ -4423,6 +4420,7 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
         }\r
         if(this.activeGroup != group && this.fireEvent('beforegroupchange', this, group, this.activeGroup) !== false){\r
             if(this.activeGroup){\r
         }\r
         if(this.activeGroup != group && this.fireEvent('beforegroupchange', this, group, this.activeGroup) !== false){\r
             if(this.activeGroup){\r
+                this.activeGroup.activeTab = null;\r
                 var oldEl = this.getGroupEl(this.activeGroup);\r
                 if(oldEl){\r
                     Ext.fly(oldEl).removeClass('x-grouptabs-strip-active');\r
                 var oldEl = this.getGroupEl(this.activeGroup);\r
                 if(oldEl){\r
                     Ext.fly(oldEl).removeClass('x-grouptabs-strip-active');\r
@@ -5093,7 +5091,7 @@ Ext.ux.grid.LockingGridView = Ext.extend(Ext.grid.GridView, {
             if(!skipStripe){\r
                 row.className = row.className.replace(this.rowClsRe, ' ');\r
                 lrow.className = lrow.className.replace(this.rowClsRe, ' ');\r
             if(!skipStripe){\r
                 row.className = row.className.replace(this.rowClsRe, ' ');\r
                 lrow.className = lrow.className.replace(this.rowClsRe, ' ');\r
-                if ((idx + 1) % 2 === 0){\r
+                if ((i + 1) % 2 === 0){\r
                     row.className += ' x-grid3-row-alt';\r
                     lrow.className += ' x-grid3-row-alt';\r
                 }\r
                     row.className += ' x-grid3-row-alt';\r
                     lrow.className += ' x-grid3-row-alt';\r
                 }\r
@@ -5577,7 +5575,7 @@ Ext.ns('Ext.ux.form');
  * @constructor\r
  * Create a new MultiSelect\r
  * @param {Object} config Configuration options\r
  * @constructor\r
  * Create a new MultiSelect\r
  * @param {Object} config Configuration options\r
- * @xtype multiselect \r
+ * @xtype multiselect\r
  */\r
 Ext.ux.form.MultiSelect = Ext.extend(Ext.form.Field,  {\r
     /**\r
  */\r
 Ext.ux.form.MultiSelect = Ext.extend(Ext.form.Field,  {\r
     /**\r
@@ -5910,7 +5908,7 @@ Ext.extend(Ext.ux.form.MultiSelect.DragZone, Ext.dd.DragZone, {
         this.onStartDrag(x, y);\r
         return true;\r
     },\r
         this.onStartDrag(x, y);\r
         return true;\r
     },\r
-    \r
+\r
     // private\r
     collectSelection: function(data) {\r
         data.repairXY = Ext.fly(this.view.getSelectedNodes()[0]).getXY();\r
     // private\r
     collectSelection: function(data) {\r
         data.repairXY = Ext.fly(this.view.getSelectedNodes()[0]).getXY();\r
@@ -5999,9 +5997,9 @@ Ext.ux.form.MultiSelect.DropZone = function(ms, config){
 \r
 Ext.extend(Ext.ux.form.MultiSelect.DropZone, Ext.dd.DropZone, {\r
     /**\r
 \r
 Ext.extend(Ext.ux.form.MultiSelect.DropZone, Ext.dd.DropZone, {\r
     /**\r
-        * Part of the Ext.dd.DropZone interface. If no target node is found, the\r
-        * whole Element becomes the target, and this causes the drop gesture to append.\r
-        */\r
+     * Part of the Ext.dd.DropZone interface. If no target node is found, the\r
+     * whole Element becomes the target, and this causes the drop gesture to append.\r
+     */\r
     getTargetFromEvent : function(e) {\r
         var target = e.getTarget();\r
         return target;\r
     getTargetFromEvent : function(e) {\r
         var target = e.getTarget();\r
         return target;\r
@@ -6084,9 +6082,14 @@ Ext.extend(Ext.ux.form.MultiSelect.DropZone, Ext.dd.DropZone, {
         var pt = this.getDropPoint(e, n, dd);\r
         if (n != this.ms.fs.body.dom)\r
             n = this.view.findItemFromChild(n);\r
         var pt = this.getDropPoint(e, n, dd);\r
         if (n != this.ms.fs.body.dom)\r
             n = this.view.findItemFromChild(n);\r
-        var insertAt = (this.ms.appendOnly || (n == this.ms.fs.body.dom)) ? this.view.store.getCount() : this.view.indexOf(n);\r
-        if (pt == "below") {\r
-            insertAt++;\r
+\r
+        if(this.ms.appendOnly) {\r
+            insertAt = this.view.store.getCount();\r
+        } else {\r
+            insertAt = n == this.ms.fs.body.dom ? this.view.store.getCount() - 1 : this.view.indexOf(n);\r
+            if (pt == "below") {\r
+                insertAt++;\r
+            }\r
         }\r
 \r
         var dir = false;\r
         }\r
 \r
         var dir = false;\r
@@ -6617,11 +6620,11 @@ Ext.ns('Ext.ux.grid');
 
 /**
  * @class Ext.ux.grid.RowEditor
 
 /**
  * @class Ext.ux.grid.RowEditor
- * @extends Ext.Panel 
+ * @extends Ext.Panel
  * Plugin (ptype = 'roweditor') that adds the ability to rapidly edit full rows in a grid.
  * A validation mode may be enabled which uses AnchorTips to notify the user of all
  * validation errors at once.
  * Plugin (ptype = 'roweditor') that adds the ability to rapidly edit full rows in a grid.
  * A validation mode may be enabled which uses AnchorTips to notify the user of all
  * validation errors at once.
- * 
+ *
  * @ptype roweditor
  */
 Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
  * @ptype roweditor
  */
 Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
@@ -6638,7 +6641,7 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
     monitorValid: true,
     focusDelay: 250,
     errorSummary: true,
     monitorValid: true,
     focusDelay: 250,
     errorSummary: true,
-    
+
     saveText: 'Save',
     cancelText: 'Cancel',
     commitChangesText: 'You need to commit or cancel your changes',
     saveText: 'Save',
     cancelText: 'Cancel',
     commitChangesText: 'You need to commit or cancel your changes',
@@ -6663,7 +6666,7 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
              * @event canceledit
              * Fired when the editor is cancelled.
              * @param {Ext.ux.grid.RowEditor} roweditor This object
              * @event canceledit
              * Fired when the editor is cancelled.
              * @param {Ext.ux.grid.RowEditor} roweditor This object
-             * @param {Boolean} forced True if the cancel button is pressed, false is the editor was invalid. 
+             * @param {Boolean} forced True if the cancel button is pressed, false is the editor was invalid.
              */
             'canceledit',
             /**
              */
             'canceledit',
             /**
@@ -6712,8 +6715,8 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
             columnresize: this.verifyLayout,
             columnmove: this.refreshFields,
             reconfigure: this.refreshFields,
             columnresize: this.verifyLayout,
             columnmove: this.refreshFields,
             reconfigure: this.refreshFields,
-               beforedestroy : this.beforedestroy,
-               destroy : this.destroy,
+            beforedestroy : this.beforedestroy,
+            destroy : this.destroy,
             bodyscroll: {
                 buffer: 250,
                 fn: this.positionButtons
             bodyscroll: {
                 buffer: 250,
                 fn: this.positionButtons
@@ -6758,7 +6761,7 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
             var g = this.grid, view = g.getView(),
                 row = view.getRow(rowIndex),
                 record = g.store.getAt(rowIndex);
             var g = this.grid, view = g.getView(),
                 row = view.getRow(rowIndex),
                 record = g.store.getAt(rowIndex);
-                
+
             this.record = record;
             this.rowIndex = rowIndex;
             this.values = {};
             this.record = record;
             this.rowIndex = rowIndex;
             this.values = {};
@@ -6802,10 +6805,10 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
             this.fireEvent('canceledit', this, saveChanges === false);
             return;
         }
             this.fireEvent('canceledit', this, saveChanges === false);
             return;
         }
-        var changes = {}, 
-            r = this.record, 
+        var changes = {},
+            r = this.record,
             hasChange = false,
             hasChange = false,
-            cm = this.grid.colModel, 
+            cm = this.grid.colModel,
             fields = this.items.items;
         for(var i = 0, len = cm.getColumnCount(); i < len; i++){
             if(!cm.isHidden(i)){
             fields = this.items.items;
         for(var i = 0, len = cm.getColumnCount(); i < len; i++){
             if(!cm.isHidden(i)){
@@ -6834,7 +6837,7 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
     verifyLayout: function(force){
         if(this.el && (this.isVisible() || force === true)){
             var row = this.grid.getView().getRow(this.rowIndex);
     verifyLayout: function(force){
         if(this.el && (this.isVisible() || force === true)){
             var row = this.grid.getView().getRow(this.rowIndex);
-            this.setSize(Ext.fly(row).getWidth(), Ext.fly(row).getHeight() + 9);
+            this.setSize(Ext.fly(row).getWidth(), Ext.isIE ? Ext.fly(row).getHeight() + 9 : undefined);
             var cm = this.grid.colModel, fields = this.items.items;
             for(var i = 0, len = cm.getColumnCount(); i < len; i++){
                 if(!cm.isHidden(i)){
             var cm = this.grid.colModel, fields = this.items.items;
             for(var i = 0, len = cm.getColumnCount(); i < len; i++){
                 if(!cm.isHidden(i)){
@@ -6867,6 +6870,8 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
                 ed = c.getEditor();
             if(!ed){
                 ed = c.displayEditor || new Ext.form.DisplayField();
                 ed = c.getEditor();
             if(!ed){
                 ed = c.displayEditor || new Ext.form.DisplayField();
+            }else{
+                ed = ed.field;
             }
             if(i == 0){
                 ed.margins = pm('0 1 2 1');
             }
             if(i == 0){
                 ed.margins = pm('0 1 2 1');
@@ -6982,7 +6987,7 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
                 scroll = view.scroller.dom.scrollLeft,
                 bw = this.btns.getWidth(),
                 width = Math.min(g.getWidth(), g.getColumnModel().getTotalWidth());
                 scroll = view.scroller.dom.scrollLeft,
                 bw = this.btns.getWidth(),
                 width = Math.min(g.getWidth(), g.getColumnModel().getTotalWidth());
-                
+
             this.btns.el.shift({left: (width/2)-(bw/2)+scroll, top: h - 2, stopFx: true, duration:0.2});
         }
     },
             this.btns.el.shift({left: (width/2)-(bw/2)+scroll, top: h - 2, stopFx: true, duration:0.2});
         }
     },
@@ -7002,14 +7007,16 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
         if(this.isVisible()){
             var index = 0,
                 cm = this.grid.getColumnModel(),
         if(this.isVisible()){
             var index = 0,
                 cm = this.grid.getColumnModel(),
-                c;
+                c,
+                ed;
             if(pt){
                 index = this.getTargetColumnIndex(pt);
             }
             for(var i = index||0, len = cm.getColumnCount(); i < len; i++){
                 c = cm.getColumnAt(i);
             if(pt){
                 index = this.getTargetColumnIndex(pt);
             }
             for(var i = index||0, len = cm.getColumnCount(); i < len; i++){
                 c = cm.getColumnAt(i);
-                if(!c.hidden && c.getEditor()){
-                    c.getEditor().focus();
+                ed = c.getEditor();
+                if(!c.hidden && ed){
+                    ed.field.focus();
                     break;
                 }
             }
                     break;
                 }
             }
@@ -7017,11 +7024,11 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
     },
 
     getTargetColumnIndex: function(pt){
     },
 
     getTargetColumnIndex: function(pt){
-        var grid = this.grid, 
+        var grid = this.grid,
             v = grid.view,
             x = pt.left,
             cms = grid.colModel.config,
             v = grid.view,
             x = pt.left,
             cms = grid.colModel.config,
-            i = 0, 
+            i = 0,
             match = false;
         for(var len = cms.length, c; c = cms[i]; i++){
             if(!c.hidden){
             match = false;
         for(var len = cms.length, c; c = cms[i]; i++){
             if(!c.hidden){
@@ -7094,7 +7101,7 @@ Ext.ux.grid.RowEditor = Ext.extend(Ext.Panel, {
             top = parseInt(this.el.dom.style.top, 10),
             scroll = v.scroller.dom.scrollTop,
             h = this.el.getHeight();
             top = parseInt(this.el.dom.style.top, 10),
             scroll = v.scroller.dom.scrollTop,
             h = this.el.getHeight();
-                
+
         if(top + h >= scroll){
             t.initTarget(this.items.last().getEl());
             if(!t.rendered){
         if(top + h >= scroll){
             t.initTarget(this.items.last().getEl());
             if(!t.rendered){
@@ -7423,22 +7430,43 @@ Ext.ux.layout.RowLayout = Ext.extend(Ext.layout.ContainerLayout, {
     // private
     monitorResize:true,
 
     // private
     monitorResize:true,
 
+    type: 'row',
+
+    // private
+    allowContainerRemove: false,
+
     // private
     isValidParent : function(c, target){
     // private
     isValidParent : function(c, target){
-        return c.getEl().dom.parentNode == this.innerCt.dom;
+        return this.innerCt && c.getPositionEl().dom.parentNode == this.innerCt.dom;
+    },
+
+    getLayoutTargetSize : function() {
+        var target = this.container.getLayoutTarget(), ret;
+        if (target) {
+            ret = target.getViewSize();
+            ret.width -= target.getPadding('lr');
+            ret.height -= target.getPadding('tb');
+        }
+        return ret;
+    },
+
+    renderAll : function(ct, target) {
+        if(!this.innerCt){
+            // the innerCt prevents wrapping and shuffling while
+            // the container is resizing
+            this.innerCt = target.createChild({cls:'x-column-inner'});
+            this.innerCt.createChild({cls:'x-clear'});
+        }
+        Ext.layout.ColumnLayout.superclass.renderAll.call(this, ct, this.innerCt);
     },
 
     // private
     onLayout : function(ct, target){
         var rs = ct.items.items, len = rs.length, r, i;
 
     },
 
     // private
     onLayout : function(ct, target){
         var rs = ct.items.items, len = rs.length, r, i;
 
-        if(!this.innerCt){
-            target.addClass('ux-row-layout-ct');
-            this.innerCt = target.createChild({cls:'x-row-inner'});
-        }
-        this.renderAll(ct, this.innerCt);
+        this.renderAll(ct, target);
 
 
-        var size = target.getViewSize(true);
+        var size = this.getLayoutTargetSize();
 
         if(size.width < 1 && size.height < 1){ // display none?
             return;
 
         if(size.width < 1 && size.height < 1){ // display none?
             return;
@@ -7455,7 +7483,7 @@ Ext.ux.layout.RowLayout = Ext.extend(Ext.layout.ContainerLayout, {
         for(i = 0; i < len; i++){
             r = rs[i];
             if(!r.rowHeight){
         for(i = 0; i < len; i++){
             r = rs[i];
             if(!r.rowHeight){
-                ph -= (r.getSize().height + r.getEl().getMargins('tb'));
+                ph -= (r.getHeight() + r.getEl().getMargins('tb'));
             }
         }
 
             }
         }
 
@@ -7467,6 +7495,20 @@ Ext.ux.layout.RowLayout = Ext.extend(Ext.layout.ContainerLayout, {
                 r.setSize({height: Math.floor(r.rowHeight*ph) - r.getEl().getMargins('tb')});
             }
         }
                 r.setSize({height: Math.floor(r.rowHeight*ph) - r.getEl().getMargins('tb')});
             }
         }
+
+        // Browsers differ as to when they account for scrollbars.  We need to re-measure to see if the scrollbar
+        // spaces were accounted for properly.  If not, re-layout.
+        if (Ext.isIE) {
+            if (i = target.getStyle('overflow') && i != 'hidden' && !this.adjustmentPass) {
+                var ts = this.getLayoutTargetSize();
+                if (ts.width != size.width){
+                    this.adjustmentPass = true;
+                    this.layoutTargetSize = ts;
+                    this.onLayout(ct, target);
+                }
+            }
+        }
+        delete this.adjustmentPass;
     }
 
     /**
     }
 
     /**
@@ -7748,7 +7790,8 @@ Ext.ux.SliderTip = Ext.extend(Ext.Tip, {
 });\r
 Ext.ux.SlidingPager = Ext.extend(Object, {\r
     init : function(pbar){\r
 });\r
 Ext.ux.SlidingPager = Ext.extend(Object, {\r
     init : function(pbar){\r
-        Ext.each(pbar.items.getRange(2,6), function(c){\r
+        var idx = pbar.items.indexOf(pbar.inputItem);\r
+        Ext.each(pbar.items.getRange(idx - 2, idx + 2), function(c){\r
             c.hide();\r
         });\r
         var slider = new Ext.Slider({\r
             c.hide();\r
         });\r
         var slider = new Ext.Slider({\r
@@ -7766,14 +7809,11 @@ Ext.ux.SlidingPager = Ext.extend(Object, {
                 }\r
             }\r
         });\r
                 }\r
             }\r
         });\r
-        pbar.insert(5, slider);\r
+        pbar.insert(idx + 1, slider);\r
         pbar.on({\r
             change: function(pb, data){\r
         pbar.on({\r
             change: function(pb, data){\r
-                slider.maxValue = data.pages;\r
+                slider.setMaxValue(data.pages);\r
                 slider.setValue(data.activePage);\r
                 slider.setValue(data.activePage);\r
-            },\r
-            beforedestroy: function(){\r
-                slider.destroy();\r
             }\r
         });\r
     }\r
             }\r
         });\r
     }\r
@@ -8606,18 +8646,7 @@ sb.setStatus({
             this.insert(0, this.statusEl);
             this.insert(1, '->');
         }
             this.insert(0, this.statusEl);
             this.insert(1, '->');
         }
-
-//         this.statusEl = td.createChild({
-//             cls: 'x-status-text ' + (this.iconCls || this.defaultIconCls || ''),
-//             html: this.text || this.defaultText || ''
-//         });
-//         this.statusEl.unselectable();
-
-//         this.spacerEl = td.insertSibling({
-//             tag: 'td',
-//             style: 'width:100%',
-//             cn: [{cls:'ytb-spacer'}]
-//         }, right ? 'before' : 'after');
+        this.doLayout();
     },
 
     /**
     },
 
     /**
@@ -9511,7 +9540,7 @@ Ext.ux.ValidationStatus = Ext.extend(Ext.Component, {
  */
 Ext.ux.tree.TreeGridNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
     isTreeGridNodeUI: true,
  */
 Ext.ux.tree.TreeGridNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
     isTreeGridNodeUI: true,
-    
+
     renderElements : function(n, a, targetNode, bulkRender){
         var t = n.getOwnerTree(),
             cols = t.columns,
     renderElements : function(n, a, targetNode, bulkRender){
         var t = n.getOwnerTree(),
             cols = t.columns,
@@ -9522,7 +9551,7 @@ Ext.ux.tree.TreeGridNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
 
         buf = [
              '<tbody class="x-tree-node">',
 
         buf = [
              '<tbody class="x-tree-node">',
-                '<tr ext:tree-node-id="', n.id ,'" class="x-tree-node-el ', a.cls, '">',
+                '<tr ext:tree-node-id="', n.id ,'" class="x-tree-node-el x-tree-node-leaf ', a.cls, '">',
                     '<td class="x-treegrid-col">',
                         '<span class="x-tree-node-indent">', this.indentMarkup, "</span>",
                         '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow">',
                     '<td class="x-treegrid-col">',
                         '<span class="x-tree-node-indent">', this.indentMarkup, "</span>",
                         '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow">',
@@ -9578,14 +9607,14 @@ Ext.ux.tree.TreeGridNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
 
 Ext.ux.tree.TreeGridRootNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
     isTreeGridNodeUI: true,
 
 Ext.ux.tree.TreeGridRootNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
     isTreeGridNodeUI: true,
-    
+
     // private
     render : function(){
         if(!this.rendered){
             this.wrap = this.ctNode = this.node.ownerTree.innerCt.dom;
             this.node.expanded = true;
         }
     // private
     render : function(){
         if(!this.rendered){
             this.wrap = this.ctNode = this.node.ownerTree.innerCt.dom;
             this.node.expanded = true;
         }
-        
+
         if(Ext.isWebKit) {
             // weird table-layout: fixed issue in webkit
             var ct = this.ctNode;
         if(Ext.isWebKit) {
             // weird table-layout: fixed issue in webkit
             var ct = this.ctNode;
@@ -9602,7 +9631,7 @@ Ext.ux.tree.TreeGridRootNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
         }
         delete this.node;
     },
         }
         delete this.node;
     },
-    
+
     collapse : Ext.emptyFn,
     expand : Ext.emptyFn
 });/**
     collapse : Ext.emptyFn,
     expand : Ext.emptyFn
 });/**
@@ -9720,6 +9749,22 @@ Ext.tree.ColumnResizer = Ext.extend(Ext.util.Observable, {
 /**
  * @class Ext.ux.tree.TreeGridSorter
  * @extends Ext.tree.TreeSorter
 /**
  * @class Ext.ux.tree.TreeGridSorter
  * @extends Ext.tree.TreeSorter
+ * Provides sorting of nodes in a {@link Ext.ux.tree.TreeGrid}.  The TreeGridSorter automatically monitors events on the
+ * associated TreeGrid that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
+ * Example usage:<br />
+ * <pre><code>
+ new Ext.ux.tree.TreeGridSorter(myTreeGrid, {
+     folderSort: true,
+     dir: "desc",
+     sortType: function(node) {
+         // sort by a custom, typed attribute:
+         return parseInt(node.id, 10);
+     }
+ });
+ </code></pre>
+ * @constructor
+ * @param {TreeGrid} tree
+ * @param {Object} config
  */
 Ext.ux.tree.TreeGridSorter = Ext.extend(Ext.tree.TreeSorter, {
     /**
  */
 Ext.ux.tree.TreeGridSorter = Ext.extend(Ext.tree.TreeSorter, {
     /**
@@ -9767,14 +9812,14 @@ Ext.ux.tree.TreeGridSorter = Ext.extend(Ext.tree.TreeSorter, {
                     return -1;
                 }
             }
                     return -1;
                 }
             }
-               var v1 = sortType ? sortType(n1.attributes[p]) : (cs ? n1.attributes[p] : n1.attributes[p].toUpperCase());
-               var v2 = sortType ? sortType(n2.attributes[p]) : (cs ? n2.attributes[p] : n2.attributes[p].toUpperCase());
-               if(v1 < v2){
-                       return dsc ? +1 : -1;
-               }else if(v1 > v2){
-                       return dsc ? -1 : +1;
+            var v1 = sortType ? sortType(n1) : (cs ? n1.attributes[p] : n1.attributes[p].toUpperCase());
+            var v2 = sortType ? sortType(n2) : (cs ? n2.attributes[p] : n2.attributes[p].toUpperCase());
+            if(v1 < v2){
+                return dsc ? +1 : -1;
+            }else if(v1 > v2){
+                return dsc ? -1 : +1;
             }else{
             }else{
-               return 0;
+                return 0;
             }
         };
 
             }
         };
 
@@ -9783,11 +9828,12 @@ Ext.ux.tree.TreeGridSorter = Ext.extend(Ext.tree.TreeSorter, {
     },
 
     onAfterTreeRender : function() {
     },
 
     onAfterTreeRender : function() {
-        var hmenu = this.tree.hmenu;
-        hmenu.insert(0,
-            {itemId:'asc', text: this.sortAscText, cls: 'xg-hmenu-sort-asc'},
-            {itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
-        );
+        if(this.tree.hmenu){
+            this.tree.hmenu.insert(0,
+                {itemId:'asc', text: this.sortAscText, cls: 'xg-hmenu-sort-asc'},
+                {itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
+            );
+        }
         this.updateSortIcon(0, 'asc');
     },
 
         this.updateSortIcon(0, 'asc');
     },
 
@@ -10001,6 +10047,17 @@ Ext.ux.tree.TreeGrid = Ext.extend(Ext.tree.TreePanel, {
         return node;
     },
     
         return node;
     },
     
+    clearInnerCt : function(){
+        if(Ext.isIE){
+            var dom = this.innerCt.dom;
+            while(dom.firstChild){
+                dom.removeChild(dom.firstChild);
+            }
+        }else{
+            Ext.ux.tree.TreeGrid.superclass.clearInnerCt.call(this);
+        }
+    },
+    
     initEvents : function() {
         Ext.ux.tree.TreeGrid.superclass.initEvents.apply(this, arguments);
 
     initEvents : function() {
         Ext.ux.tree.TreeGrid.superclass.initEvents.apply(this, arguments);