TextArea_wev8.js
3.48 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
/*
* Ext JS Library 2.0.2
* Copyright(c) 2006-2008, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
/**
* @class Ext.form.TextArea
* @extends Ext.form.TextField
* Multiline text field. Can be used as a direct replacement for traditional textarea fields, plus adds
* support for auto-sizing.
* @constructor
* Creates a new TextArea
* @param {Object} config Configuration options
*/
Ext.form.TextArea = Ext.extend(Ext.form.TextField, {
/**
* @cfg {Number} growMin The minimum height to allow when grow = true (defaults to 60)
*/
growMin : 60,
/**
* @cfg {Number} growMax The maximum height to allow when grow = true (defaults to 1000)
*/
growMax: 1000,
growAppend : ' \n ',
growPad : 0,
enterIsSpecial : false,
/**
* @cfg {Boolean} preventScrollbars True to prevent scrollbars from appearing regardless of how much text is
* in the field (equivalent to setting overflow: hidden, defaults to false)
*/
preventScrollbars: false,
/**
* @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
* {tag: "textarea", style: "width:100px;height:60px;", autocomplete: "off"})
*/
// private
onRender : function(ct, position){
if(!this.el){
this.defaultAutoCreate = {
tag: "textarea",
style:"width:100px;height:60px;",
autocomplete: "off"
};
}
Ext.form.TextArea.superclass.onRender.call(this, ct, position);
if(this.grow){
this.textSizeEl = Ext.DomHelper.append(document.body, {
tag: "pre", cls: "x-form-grow-sizer"
});
if(this.preventScrollbars){
this.el.setStyle("overflow", "hidden");
}
this.el.setHeight(this.growMin);
}
},
onDestroy : function(){
if(this.textSizeEl){
Ext.removeNode(this.textSizeEl);
}
Ext.form.TextArea.superclass.onDestroy.call(this);
},
fireKey : function(e){
if(e.isSpecialKey() && (this.enterIsSpecial || (e.getKey() != e.ENTER || e.hasModifier()))){
this.fireEvent("specialkey", this, e);
}
},
// private
onKeyUp : function(e){
if(!e.isNavKeyPress() || e.getKey() == e.ENTER){
this.autoSize();
}
},
/**
* Automatically grows the field to accomodate the height of the text up to the maximum field height allowed.
* This only takes effect if grow = true, and fires the autosize event if the height changes.
*/
autoSize : function(){
if(!this.grow || !this.textSizeEl){
return;
}
var el = this.el;
var v = el.dom.value;
var ts = this.textSizeEl;
ts.innerHTML = '';
ts.appendChild(document.createTextNode(v));
v = ts.innerHTML;
Ext.fly(ts).setWidth(this.el.getWidth());
if(v.length < 1){
v = "  ";
}else{
if(Ext.isIE){
v = v.replace(/\n/g, '<p> </p>');
}
v += this.growAppend;
}
ts.innerHTML = v;
var h = Math.min(this.growMax, Math.max(ts.offsetHeight, this.growMin)+this.growPad);
if(h != this.lastHeight){
this.lastHeight = h;
this.el.setHeight(h);
this.fireEvent("autosize", this, h);
}
}
});
Ext.reg('textarea', Ext.form.TextArea);