Upgrade to ExtJS 3.0.3 - Released 10/11/2009
[extjs.git] / docs / source / FileUploadField.html
index 0d309ea..e8d6d69 100644 (file)
@@ -1,10 +1,10 @@
-<html>\r
-<head>\r
-  <title>The source code</title>\r
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body  onload="prettyPrint();">\r
+<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.ns('Ext.ux.form');
 
 <div id="cls-Ext.ux.form.FileUploadField"></div>/**
     <pre class="prettyprint lang-js">Ext.ns('Ext.ux.form');
 
 <div id="cls-Ext.ux.form.FileUploadField"></div>/**
@@ -66,15 +66,7 @@ Ext.ux.form.FileUploadField = Ext.extend(Ext.form.TextField,  {
         this.wrap = this.el.wrap({cls:'x-form-field-wrap x-form-file-wrap'});
         this.el.addClass('x-form-file-text');
         this.el.dom.removeAttribute('name');
         this.wrap = this.el.wrap({cls:'x-form-field-wrap x-form-file-wrap'});
         this.el.addClass('x-form-file-text');
         this.el.dom.removeAttribute('name');
-
-        this.fileInput = this.wrap.createChild({
-            id: this.getFileInputId(),
-            name: this.name||this.getId(),
-            cls: 'x-form-file',
-            tag: 'input',
-            type: 'file',
-            size: 1
-        });
+        this.createFileInput();
 
         var btnCfg = Ext.applyIf(this.buttonCfg || {}, {
             text: this.buttonText
 
         var btnCfg = Ext.applyIf(this.buttonCfg || {}, {
             text: this.buttonText
@@ -89,11 +81,49 @@ Ext.ux.form.FileUploadField = Ext.extend(Ext.form.TextField,  {
             this.wrap.setWidth(this.button.getEl().getWidth());
         }
 
             this.wrap.setWidth(this.button.getEl().getWidth());
         }
 
-        this.fileInput.on('change', function(){
-            var v = this.fileInput.dom.value;
-            this.setValue(v);
-            this.fireEvent('fileselected', this, v);
-        }, this);
+        this.bindListeners();
+        this.resizeEl = this.positionEl = this.wrap;
+    },
+    
+    bindListeners: function(){
+        this.fileInput.on({
+            scope: this,
+            mouseenter: function() {
+                this.button.addClass(['x-btn-over','x-btn-focus'])
+            },
+            mouseleave: function(){
+                this.button.removeClass(['x-btn-over','x-btn-focus','x-btn-click'])
+            },
+            mousedown: function(){
+                this.button.addClass('x-btn-click')
+            },
+            mouseup: function(){
+                this.button.removeClass(['x-btn-over','x-btn-focus','x-btn-click'])
+            },
+            change: function(){
+                var v = this.fileInput.dom.value;
+                this.setValue(v);
+                this.fireEvent('fileselected', this, v);    
+            }
+        }); 
+    },
+    
+    createFileInput : function() {
+        this.fileInput = this.wrap.createChild({
+            id: this.getFileInputId(),
+            name: this.name||this.getId(),
+            cls: 'x-form-file',
+            tag: 'input',
+            type: 'file',
+            size: 1
+        });
+    },
+    
+    reset : function(){
+        this.fileInput.remove();
+        this.createFileInput();
+        this.bindListeners();
+        Ext.ux.form.FileUploadField.superclass.reset.call(this);
     },
 
     // private
     },
 
     // private
@@ -118,20 +148,27 @@ Ext.ux.form.FileUploadField = Ext.extend(Ext.form.TextField,  {
         Ext.ux.form.FileUploadField.superclass.onDestroy.call(this);
         Ext.destroy(this.fileInput, this.button, this.wrap);
     },
         Ext.ux.form.FileUploadField.superclass.onDestroy.call(this);
         Ext.destroy(this.fileInput, this.button, this.wrap);
     },
+    
+    onDisable: function(){
+        Ext.ux.form.FileUploadField.superclass.onDisable.call(this);
+        this.doDisable(true);
+    },
+    
+    onEnable: function(){
+        Ext.ux.form.FileUploadField.superclass.onEnable.call(this);
+        this.doDisable(false);
 
 
-
-    // private
-    preFocus : Ext.emptyFn,
-
+    },
+    
     // private
     // private
-    getResizeEl : function(){
-        return this.wrap;
+    doDisable: function(disabled){
+        this.fileInput.dom.disabled = disabled;
+        this.button.setDisabled(disabled);
     },
 
     },
 
+
     // private
     // private
-    getPositionEl : function(){
-        return this.wrap;
-    },
+    preFocus : Ext.emptyFn,
 
     // private
     alignErrorIcon : function(){
 
     // private
     alignErrorIcon : function(){
@@ -144,6 +181,6 @@ Ext.reg('fileuploadfield', Ext.ux.form.FileUploadField);
 
 // backwards compat
 Ext.form.FileUploadField = Ext.ux.form.FileUploadField;
 
 // backwards compat
 Ext.form.FileUploadField = Ext.ux.form.FileUploadField;
-</pre>    \r
-</body>\r
+</pre>
+</body>
 </html>
\ No newline at end of file
 </html>
\ No newline at end of file