X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/ee06f37b0f6f6d94cd05a6ffae556660f7c4a2bc..76cb34406ceaf9681a76e13b531d7eafa483ad88:/examples/statusbar/ValidationStatus.js

diff --git a/examples/statusbar/ValidationStatus.js b/examples/statusbar/ValidationStatus.js
index d3610ed0..ff3a803a 100644
--- a/examples/statusbar/ValidationStatus.js
+++ b/examples/statusbar/ValidationStatus.js
@@ -1,165 +1,169 @@
+/*!
+ * Ext JS Library 3.0.0
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
 /*
- * Ext JS Library 2.2.1
- * Copyright(c) 2006-2009, Ext JS, LLC.
+ * Ext JS Library 2.2
+ * Copyright(c) 2006-2008, Ext JS, LLC.
  * licensing@extjs.com
  * 
  * http://extjs.com/license
  */
 
-/**
- * @class Ext.ux.ValidationStatus
- * A {@link Ext.StatusBar} plugin that provides automatic error notification when the
- * associated form contains validation errors.
- * @extends Ext.Component
- * @constructor
- * Creates a new ValiationStatus plugin
- * @param {Object} config A config object
- */
-Ext.ux.ValidationStatus = Ext.extend(Ext.Component, {
-    
-    errorIconCls : 'x-status-error',
-    
-    errorListCls : 'x-status-error-list',
-    
-    validIconCls : 'x-status-valid',
-    
-    showText : 'The form has errors (click for details...)',
-    
-    hideText : 'Click again to hide the error list',
-    
-    submitText : 'Saving...',
-    
-    // private
-    init : function(sb){
-        sb.on('render', function(){
-            this.statusBar = sb;
-            this.monitor = true;
-            this.errors = new Ext.util.MixedCollection();
-            this.listAlign = (sb.statusAlign=='right' ? 'br-tr?' : 'bl-tl?');
-            
-            if(this.form){
-                this.form = Ext.getCmp(this.form).getForm();
-                this.startMonitoring();
-                
-                // Have to give the status bar time to render since it happens in afterRender
-                (function(){
-                    sb.statusEl.on('click', this.onStatusClick, this, {buffer:200});
-                }).defer(200, this);
-                
-                this.form.on('beforeaction', function(f, action){
-                    if(action.type == 'submit'){
-                        // Ignore monitoring while submitting otherwise the field validation
-                        // events cause the status message to reset too early
-                        this.monitor = false;
-                    }
-                }, this);
-                var startMonitor = function(){
-                    this.monitor = true;
-                }
-                this.form.on('actioncomplete', startMonitor, this);
-                this.form.on('actionfailed', startMonitor, this);
-            }
+/**
+ * @class Ext.ux.ValidationStatus
+ * A {@link Ext.StatusBar} plugin that provides automatic error notification when the
+ * associated form contains validation errors.
+ * @extends Ext.Component
+ * @constructor
+ * Creates a new ValiationStatus plugin
+ * @param {Object} config A config object
+ */
+Ext.ux.ValidationStatus = Ext.extend(Ext.Component, {
+    
+    errorIconCls : 'x-status-error',
+    
+    errorListCls : 'x-status-error-list',
+    
+    validIconCls : 'x-status-valid',
+    
+    showText : 'The form has errors (click for details...)',
+    
+    hideText : 'Click again to hide the error list',
+    
+    submitText : 'Saving...',
+    
+    // private
+    init : function(sb){
+        sb.on('render', function(){
+            this.statusBar = sb;
+            this.monitor = true;
+            this.errors = new Ext.util.MixedCollection();
+            this.listAlign = (sb.statusAlign=='right' ? 'br-tr?' : 'bl-tl?');
+            
+            if(this.form){
+                this.form = Ext.getCmp(this.form).getForm();
+                this.startMonitoring();
+                this.form.on('beforeaction', function(f, action){
+                    if(action.type == 'submit'){
+                        // Ignore monitoring while submitting otherwise the field validation
+                        // events cause the status message to reset too early
+                        this.monitor = false;
+                    }
+                }, this);
+                var startMonitor = function(){
+                    this.monitor = true;
+                }
+                this.form.on('actioncomplete', startMonitor, this);
+                this.form.on('actionfailed', startMonitor, this);
+            }
         }, this, {single:true});
-    },
-    
-    // private
-    startMonitoring : function(){
-        this.form.items.each(function(f){
-            f.on('invalid', this.onFieldValidation, this);
-            f.on('valid', this.onFieldValidation, this);
-        }, this);
-    },
-    
-    // private
-    stopMonitoring : function(){
-        this.form.items.each(function(f){
-            f.un('invalid', this.onFieldValidation, this);
-            f.un('valid', this.onFieldValidation, this);
-        }, this);
-    },
-    
-    // private
-    onDestroy : function(){
-        this.stopMonitoring();
-        this.statusBar.statusEl.un('click', this.onStatusClick, this);
-        Ext.ux.ValidationStatus.superclass.onDestroy.call(this);
-    },
-    
-    // private
-    onFieldValidation : function(f, msg){
-        if(!this.monitor){
-            return false;
-        }
-        if(msg){
-            this.errors.add(f.id, {field:f, msg:msg});
-        }else{
-            this.errors.removeKey(f.id);
-        }
-        this.updateErrorList();
-        if(this.errors.getCount() > 0){
-            if(this.statusBar.getText() != this.showText){
-                this.statusBar.setStatus({text:this.showText, iconCls:this.errorIconCls});
-            }
-        }else{
-            this.statusBar.clearStatus().setIcon(this.validIconCls);
-        }
-    },
-    
-    // private
-    updateErrorList : function(){
-        if(this.errors.getCount() > 0){
-	        var msg = '<ul>';
-	        this.errors.each(function(err){
-	            msg += ('<li id="x-err-'+ err.field.id +'"><a href="#">' + err.msg + '</a></li>');
-	        }, this);
-	        this.getMsgEl().update(msg+'</ul>');
-        }else{
-            this.getMsgEl().update('');
-        }
-    },
-    
-    // private
-    getMsgEl : function(){
-        if(!this.msgEl){
-            this.msgEl = Ext.DomHelper.append(Ext.getBody(), {
-                cls: this.errorListCls+' x-hide-offsets'
-            }, true);
-            
-            this.msgEl.on('click', function(e){
-                var t = e.getTarget('li', 10, true);
-                if(t){
-                    Ext.getCmp(t.id.split('x-err-')[1]).focus();
-                    this.hideErrors();
-                }
-            }, this, {stopEvent:true}); // prevent anchor click navigation
-        }
-        return this.msgEl;
-    },
-    
-    // private
-    showErrors : function(){
-        this.updateErrorList();
-        this.getMsgEl().alignTo(this.statusBar.getEl(), this.listAlign).slideIn('b', {duration:.3, easing:'easeOut'});
-        this.statusBar.setText(this.hideText);
-        this.form.getEl().on('click', this.hideErrors, this, {single:true}); // hide if the user clicks directly into the form
-    },
-    
-    // private
-    hideErrors : function(){
-        var el = this.getMsgEl();
-        if(el.isVisible()){
-	        el.slideOut('b', {duration:.2, easing:'easeIn'});
-	        this.statusBar.setText(this.showText);
-        }
-        this.form.getEl().un('click', this.hideErrors, this);
-    },
-    
-    // private
-    onStatusClick : function(){
-        if(this.getMsgEl().isVisible()){
-            this.hideErrors();
-        }else if(this.errors.getCount() > 0){
-            this.showErrors();
-        }
-    }
+        sb.on('afterlayout', function(){
+            // Grab the statusEl after the first layout.
+            sb.statusEl.getEl().on('click', this.onStatusClick, this, {buffer:200});
+        }, this, {single: true});
+    },
+    
+    // private
+    startMonitoring : function(){
+        this.form.items.each(function(f){
+            f.on('invalid', this.onFieldValidation, this);
+            f.on('valid', this.onFieldValidation, this);
+        }, this);
+    },
+    
+    // private
+    stopMonitoring : function(){
+        this.form.items.each(function(f){
+            f.un('invalid', this.onFieldValidation, this);
+            f.un('valid', this.onFieldValidation, this);
+        }, this);
+    },
+    
+    // private
+    onDestroy : function(){
+        this.stopMonitoring();
+        this.statusBar.statusEl.un('click', this.onStatusClick, this);
+        Ext.ux.ValidationStatus.superclass.onDestroy.call(this);
+    },
+    
+    // private
+    onFieldValidation : function(f, msg){
+        if(!this.monitor){
+            return false;
+        }
+        if(msg){
+            this.errors.add(f.id, {field:f, msg:msg});
+        }else{
+            this.errors.removeKey(f.id);
+        }
+        this.updateErrorList();
+        if(this.errors.getCount() > 0){
+            if(this.statusBar.getText() != this.showText){
+                this.statusBar.setStatus({text:this.showText, iconCls:this.errorIconCls});
+            }
+        }else{
+            this.statusBar.clearStatus().setIcon(this.validIconCls);
+        }
+    },
+    
+    // private
+    updateErrorList : function(){
+        if(this.errors.getCount() > 0){
+	        var msg = '<ul>';
+	        this.errors.each(function(err){
+	            msg += ('<li id="x-err-'+ err.field.id +'"><a href="#">' + err.msg + '</a></li>');
+	        }, this);
+	        this.getMsgEl().update(msg+'</ul>');
+        }else{
+            this.getMsgEl().update('');
+        }
+    },
+    
+    // private
+    getMsgEl : function(){
+        if(!this.msgEl){
+            this.msgEl = Ext.DomHelper.append(Ext.getBody(), {
+                cls: this.errorListCls+' x-hide-offsets'
+            }, true);
+            
+            this.msgEl.on('click', function(e){
+                var t = e.getTarget('li', 10, true);
+                if(t){
+                    Ext.getCmp(t.id.split('x-err-')[1]).focus();
+                    this.hideErrors();
+                }
+            }, this, {stopEvent:true}); // prevent anchor click navigation
+        }
+        return this.msgEl;
+    },
+    
+    // private
+    showErrors : function(){
+        this.updateErrorList();
+        this.getMsgEl().alignTo(this.statusBar.getEl(), this.listAlign).slideIn('b', {duration:.3, easing:'easeOut'});
+        this.statusBar.setText(this.hideText);
+        this.form.getEl().on('click', this.hideErrors, this, {single:true}); // hide if the user clicks directly into the form
+    },
+    
+    // private
+    hideErrors : function(){
+        var el = this.getMsgEl();
+        if(el.isVisible()){
+	        el.slideOut('b', {duration:.2, easing:'easeIn'});
+	        this.statusBar.setText(this.showText);
+        }
+        this.form.getEl().un('click', this.hideErrors, this);
+    },
+    
+    // private
+    onStatusClick : function(){
+        if(this.getMsgEl().isVisible()){
+            this.hideErrors();
+        }else if(this.errors.getCount() > 0){
+            this.showErrors();
+        }
+    }
 });
\ No newline at end of file