JavaScript

开发平台：

JavaScript

pkg-forms-debug.js：源码内容

* @cfg {String} itemCls A css class to apply to the <tt>x-form-item</tt> of fields (see
* {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} for details).
* This property cascades to child containers.
*/
/**
* @cfg {String} baseCls The base CSS class applied to the fieldset (defaults to <tt>'x-fieldset'</tt>).
*/
baseCls : 'x-fieldset',
/**
* @cfg {String} layout The {@link Ext.Container#layout} to use inside the fieldset (defaults to <tt>'form'</tt>).
*/
layout : 'form',
/**
* @cfg {Boolean} animCollapse
* <tt>true</tt> to animate the transition when the panel is collapsed, <tt>false</tt> to skip the
* animation (defaults to <tt>false</tt>).
*/
animCollapse : false,
// private
onRender : function(ct, position){
if(!this.el){
this.el = document.createElement('fieldset');
this.el.id = this.id;
if (this.title || this.header || this.checkboxToggle) {
this.el.appendChild(document.createElement('legend')).className = 'x-fieldset-header';
}
}
Ext.form.FieldSet.superclass.onRender.call(this, ct, position);
if(this.checkboxToggle){
var o = typeof this.checkboxToggle == 'object' ?
this.checkboxToggle :
{tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};
this.checkbox = this.header.insertFirst(o);
this.checkbox.dom.checked = !this.collapsed;
this.mon(this.checkbox, 'click', this.onCheckClick, this);
}
},
// private
onCollapse : function(doAnim, animArg){
if(this.checkbox){
this.checkbox.dom.checked = false;
}
Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);
},
// private
onExpand : function(doAnim, animArg){
if(this.checkbox){
this.checkbox.dom.checked = true;
}
Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);
},
/**
* This function is called by the fieldset's checkbox when it is toggled (only applies when
* checkboxToggle = true). This method should never be called externally, but can be
* overridden to provide custom behavior when the checkbox is toggled if needed.
*/
onCheckClick : function(){
this[this.checkbox.dom.checked ? 'expand' : 'collapse']();
}
/**
* @cfg {String/Number} activeItem
* @hide
*/
/**
* @cfg {Mixed} applyTo
* @hide
*/
/**
* @cfg {Boolean} bodyBorder
* @hide
*/
/**
* @cfg {Boolean} border
* @hide
*/
/**
* @cfg {Boolean/Number} bufferResize
* @hide
*/
/**
* @cfg {Boolean} collapseFirst
* @hide
*/
/**
* @cfg {String} defaultType
* @hide
*/
/**
* @cfg {String} disabledClass
* @hide
*/
/**
* @cfg {String} elements
* @hide
*/
/**
* @cfg {Boolean} floating
* @hide
*/
/**
* @cfg {Boolean} footer
* @hide
*/
/**
* @cfg {Boolean} frame
* @hide
*/
/**
* @cfg {Boolean} header
* @hide
*/
/**
* @cfg {Boolean} headerAsText
* @hide
*/
/**
* @cfg {Boolean} hideCollapseTool
* @hide
*/
/**
* @cfg {String} iconCls
* @hide
*/
/**
* @cfg {Boolean/String} shadow
* @hide
*/
/**
* @cfg {Number} shadowOffset
* @hide
*/
/**
* @cfg {Boolean} shim
* @hide
*/
/**
* @cfg {Object/Array} tbar
* @hide
*/
/**
* @cfg {Array} tools
* @hide
*/
/**
* @cfg {Ext.Template/Ext.XTemplate} toolTemplate
* @hide
*/
/**
* @cfg {String} xtype
* @hide
*/
/**
* @property header
* @hide
*/
/**
* @property footer
* @hide
*/
/**
* @method focus
* @hide
*/
/**
* @method getBottomToolbar
* @hide
*/
/**
* @method getTopToolbar
* @hide
*/
/**
* @method setIconClass
* @hide
*/
/**
* @event activate
* @hide
*/
/**
* @event beforeclose
* @hide
*/
/**
* @event bodyresize
* @hide
*/
/**
* @event close
* @hide
*/
/**
* @event deactivate
* @hide
*/
});
Ext.reg('fieldset', Ext.form.FieldSet);
/** * @class Ext.form.HtmlEditor * @extends Ext.form.Field * Provides a lightweight HTML Editor component. Some toolbar features are not supported by Safari and will be * automatically hidden when needed. These are noted in the config options where appropriate. * The editor's toolbar buttons have tooltips defined in the {@link #buttonTips} property, but they are not * enabled by default unless the global {@link Ext.QuickTips} singleton is {@link Ext.QuickTips#init initialized}. * Note: The focus/blur and validation marking functionality inherited from Ext.form.Field is NOT * supported by this editor. * An Editor is a sensitive component that can't be used in all spots standard fields can be used. Putting an Editor within * any element that has display set to 'none' can cause problems in Safari and Firefox due to their default iframe reloading bugs. * Example usage: * <pre><code> // Simple example rendered with default options: Ext.QuickTips.init(); // enable tooltips new Ext.form.HtmlEditor({ renderTo: Ext.getBody(), width: 800, height: 300 }); // Passed via xtype into a container and with custom options: Ext.QuickTips.init(); // enable tooltips new Ext.Panel({ title: 'HTML Editor', renderTo: Ext.getBody(), width: 600, height: 300, frame: true, layout: 'fit', items: { xtype: 'htmleditor', enableColors: false, enableAlignments: false } }); </code></pre> * @constructor * Create a new HtmlEditor * @param {Object} config * @xtype htmleditor */ Ext.form.HtmlEditor = Ext.extend(Ext.form.Field, { /** * @cfg {Boolean} enableFormat Enable the bold, italic and underline buttons (defaults to true) */ enableFormat : true, /** * @cfg {Boolean} enableFontSize Enable the increase/decrease font size buttons (defaults to true) */ enableFontSize : true, /** * @cfg {Boolean} enableColors Enable the fore/highlight color buttons (defaults to true) */ enableColors : true, /** * @cfg {Boolean} enableAlignments Enable the left, center, right alignment buttons (defaults to true) */ enableAlignments : true, /** * @cfg {Boolean} enableLists Enable the bullet and numbered list buttons. Not available in Safari. (defaults to true) */ enableLists : true, /** * @cfg {Boolean} enableSourceEdit Enable the switch to source edit button. Not available in Safari. (defaults to true) */ enableSourceEdit : true, /** * @cfg {Boolean} enableLinks Enable the create link button. Not available in Safari. (defaults to true) */ enableLinks : true, /** * @cfg {Boolean} enableFont Enable font selection. Not available in Safari. (defaults to true) */ enableFont : true, /** * @cfg {String} createLinkText The default text for the create link prompt */ createLinkText : 'Please enter the URL for the link:', /** * @cfg {String} defaultLinkValue The default value for the create link prompt (defaults to http:/ /) */ defaultLinkValue : 'http:/'+'/', /** * @cfg {Array} fontFamilies An array of available font families */ fontFamilies : [ 'Arial', 'Courier New', 'Tahoma', 'Times New Roman', 'Verdana' ], defaultFont: 'tahoma', /** * @cfg {String} defaultValue A default value to be put into the editor to resolve focus issues (defaults to   (Non-breaking space) in Opera and IE6, (Zero-width space) in all other browsers). */ defaultValue: (Ext.isOpera || Ext.isIE6) ? ' ' : '', // private properties actionMode: 'wrap', validationEvent : false, deferHeight: true, initialized : false, activated : false, sourceEditMode : false, onFocus : Ext.emptyFn, iframePad:3, hideMode:'offsets', defaultAutoCreate : { tag: "textarea", style:"width:500px;height:300px;", autocomplete: "off" }, // private initComponent : function(){ this.addEvents( /** * @event initialize * Fires when the editor is fully initialized (including the iframe) * @param {HtmlEditor} this */ 'initialize', /** * @event activate * Fires when the editor is first receives the focus. Any insertion must wait * until after this event. * @param {HtmlEditor} this */ 'activate', /** * @event beforesync * Fires before the textarea is updated with content from the editor iframe. Return false * to cancel the sync. * @param {HtmlEditor} this * @param {String} html */ 'beforesync', /** * @event beforepush * Fires before the iframe editor is updated with content from the textarea. Return false * to cancel the push. * @param {HtmlEditor} this * @param {String} html */ 'beforepush', /** * @event sync * Fires when the textarea is updated with content from the editor iframe. * @param {HtmlEditor} this * @param {String} html */ 'sync', /** * @event push * Fires when the iframe editor is updated with content from the textarea. * @param {HtmlEditor} this * @param {String} html */ 'push', /** * @event editmodechange * Fires when the editor switches edit modes * @param {HtmlEditor} this * @param {Boolean} sourceEdit True if source edit, false if standard editing. */ 'editmodechange' ) }, // private createFontOptions : function(){ var buf = [], fs = this.fontFamilies, ff, lc; for(var i = 0, len = fs.length; i< len; i++){ ff = fs[i]; lc = ff.toLowerCase(); buf.push( '<option value="',lc,'" style="font-family:',ff,';"', (this.defaultFont == lc ? ' selected="true">' : '>'), ff, '</option>' ); } return buf.join(''); }, /* * Protected method that will not generally be called directly. It * is called when the editor creates its toolbar. Override this method if you need to * add custom toolbar buttons. * @param {HtmlEditor} editor */ createToolbar : function(editor){ var items = []; var tipsEnabled = Ext.QuickTips && Ext.QuickTips.isEnabled();
function btn(id, toggle, handler){ return { itemId : id, cls : 'x-btn-icon', iconCls: 'x-edit-'+id, enableToggle:toggle !== false, scope: editor, handler:handler||editor.relayBtnCmd, clickEvent:'mousedown', tooltip: tipsEnabled ? editor.buttonTips[id] || undefined : undefined, overflowText: editor.buttonTips[id].title || undefined, tabIndex:-1 }; } if(this.enableFont && !Ext.isSafari2){
var fontSelectItem = new Ext.Toolbar.Item({
autoEl: {
tag:'select',