开通博客赚积分
发布资源赚积分
分类

源码开发语言/平台
当前位置：首页 > 源码/资料 > 中间件编程 > 查看源码
FileUploadField.js
资源名称：ext-3.0.0.zip　[点击查看]
上传用户：shuoshiled
上传日期：2018-01-28
资源大小：10124k
文件大小：4k
源码类别：

中间件编程

开发平台：

JavaScript

FileUploadField.js：源码内容
  1. /*!
  2.  * Ext JS Library 3.0.0
  3.  * Copyright(c) 2006-2009 Ext JS, LLC
  4.  * licensing@extjs.com
  5.  * http://www.extjs.com/license
  6.  */
  7. Ext.ns('Ext.ux.form');
  9. /**
  10.  * @class Ext.ux.form.FileUploadField
  11.  * @extends Ext.form.TextField
  12.  * Creates a file upload field.
  13.  * @xtype fileuploadfield
  14.  */
  15. Ext.ux.form.FileUploadField = Ext.extend(Ext.form.TextField,  {
  16.     /**
  17.      * @cfg {String} buttonText The button text to display on the upload button (defaults to
  18.      * 'Browse...').  Note that if you supply a value for {@link #buttonCfg}, the buttonCfg.text
  19.      * value will be used instead if available.
  20.      */
  21.     buttonText: 'Browse...',
  22.     /**
  23.      * @cfg {Boolean} buttonOnly True to display the file upload field as a button with no visible
  24.      * text field (defaults to false).  If true, all inherited TextField members will still be available.
  25.      */
  26.     buttonOnly: false,
  27.     /**
  28.      * @cfg {Number} buttonOffset The number of pixels of space reserved between the button and the text field
  29.      * (defaults to 3).  Note that this only applies if {@link #buttonOnly} = false.
  30.      */
  31.     buttonOffset: 3,
  32.     /**
  33.      * @cfg {Object} buttonCfg A standard {@link Ext.Button} config object.
  34.      */
  36.     // private
  37.     readOnly: true,
  39.     /**
  40.      * @hide
  41.      * @method autoSize
  42.      */
  43.     autoSize: Ext.emptyFn,
  45.     // private
  46.     initComponent: function(){
  47.         Ext.ux.form.FileUploadField.superclass.initComponent.call(this);
  49.         this.addEvents(
  50.             /**
  51.              * @event fileselected
  52.              * Fires when the underlying file input field's value has changed from the user
  53.              * selecting a new file from the system file selection dialog.
  54.              * @param {Ext.ux.form.FileUploadField} this
  55.              * @param {String} value The file value returned by the underlying file input field
  56.              */
  57.             'fileselected'
  58.         );
  59.     },
  61.     // private
  62.     onRender : function(ct, position){
  63.         Ext.ux.form.FileUploadField.superclass.onRender.call(this, ct, position);
  65.         this.wrap = this.el.wrap({cls:'x-form-field-wrap x-form-file-wrap'});
  66.         this.el.addClass('x-form-file-text');
  67.         this.el.dom.removeAttribute('name');
  69.         this.fileInput = this.wrap.createChild({
  70.             id: this.getFileInputId(),
  71.             name: this.name||this.getId(),
  72.             cls: 'x-form-file',
  73.             tag: 'input',
  74.             type: 'file',
  75.             size: 1
  76.         });
  78.         var btnCfg = Ext.applyIf(this.buttonCfg || {}, {
  79.             text: this.buttonText
  80.         });
  81.         this.button = new Ext.Button(Ext.apply(btnCfg, {
  82.             renderTo: this.wrap,
  83.             cls: 'x-form-file-btn' + (btnCfg.iconCls ? ' x-btn-icon' : '')
  84.         }));
  86.         if(this.buttonOnly){
  87.             this.el.hide();
  88.             this.wrap.setWidth(this.button.getEl().getWidth());
  89.         }
  91.         this.fileInput.on('change', function(){
  92.             var v = this.fileInput.dom.value;
  93.             this.setValue(v);
  94.             this.fireEvent('fileselected', this, v);
  95.         }, this);
  96.     },
  98.     // private
  99.     getFileInputId: function(){
  100.         return this.id + '-file';
  101.     },
  103.     // private
  104.     onResize : function(w, h){
  105.         Ext.ux.form.FileUploadField.superclass.onResize.call(this, w, h);
  107.         this.wrap.setWidth(w);
  109.         if(!this.buttonOnly){
  110.             var w = this.wrap.getWidth() - this.button.getEl().getWidth() - this.buttonOffset;
  111.             this.el.setWidth(w);
  112.         }
  113.     },
  115.     // private
  116.     onDestroy: function(){
  117.         Ext.ux.form.FileUploadField.superclass.onDestroy.call(this);
  118.         Ext.destroy(this.fileInput, this.button, this.wrap);
  119.     },
  122.     // private
  123.     preFocus : Ext.emptyFn,
  125.     // private
  126.     getResizeEl : function(){
  127.         return this.wrap;
  128.     },
  130.     // private
  131.     getPositionEl : function(){
  132.         return this.wrap;
  133.     },
  135.     // private
  136.     alignErrorIcon : function(){
  137.         this.errorIcon.alignTo(this.wrap, 'tl-tr', [2, 0]);
  138.     }
  140. });
  142. Ext.reg('fileuploadfield', Ext.ux.form.FileUploadField);
  144. // backwards compat
  145. Ext.form.FileUploadField = Ext.ux.form.FileUploadField;