Ext.Net/ExtJs:關於TextField控制元件內size、maxLength控制文字框輸入字元長度屬性失效問題分析以及解決方案
今天發現這樣一個關於Ext.Net內TextField文字框設定屬性MaxLength、Size、MaxLengthText均失效問題,設定了此屬性,依然可以無限制地輸入文字資訊。無奈之餘,網上搜索了一番,發現在ExtJs版本內也會存在這個問題。
先給我自己的解決辦法(這是一個可編輯grid,obj為遍歷的出的列物件)
if(obj.edittype ==
"text"){
var vali2 = false;
var maxlength2 =2000; //預設最大字數限制2000
var maxlength3 = 0;
if(""!=obj.maxLength&&undefined!=obj.maxLength){
maxlength2 = parseInt(obj.maxLength)
}
column.editor = {
xtype: 'textfield',
maxLength:maxlength2,
//maxlengthText:'字數不大於'+maxlength,
listeners : {
/*'afterrender':function(field1,eOpts){
if (!isNaN(field1.maxLength) && (field1.maxLength * 1) > 0 && (field1.maxLength != Number.MAX_VALUE)) {
field1.el.dom.maxLength = 10;
}
}*/
'change' : function(field,newValue,oldValue){
//事件發生時無法獲取變數maxlength2的值,所以添加了 maxLength屬性
if(field.maxLength>0&&newValue.length>field.maxLength){
var value1 = newValue.substring(0,field.maxLength);
field.setValue(value1);
maxlength3 = field.maxLength;
vali2=true;
}
}
},
validator:function (value){
if(vali2){
vali2 =false;
return "字數不大於"+ maxlength3;
}
return true ;
}
}
}
一、ExtJs內TextField設定maxLength失效問題解決辦法
在ext-all.js檔案引入之後加入這樣一段JS程式碼即可:
1.
Ext.form.TextField.prototype.size
= 20;
2.
Ext.form.TextField.prototype.initValue
=
function
()
{
3.
if
(!isNaN(
this
.maxLength)
&& (
this
.maxLength
* 1) > 0 && (
this
.maxLength
!= Number.MAX_VALUE)) {
4.
this
.el.dom.maxLength
=
this
.maxLength
* 1;
5.
}
6.
};
這樣做的目的是通過所設定的maxLength屬性通過動態的方式加入到該TextField物件的dom內去,讓其真正地生效。
二、Ext.Net內TextField設定maxLength失效問題解決辦法
這個不能與ExtJs一樣使用,因為在Ext.Net內你將會找不到this.el物件,更不能設定maxLength屬性了的。我們需要通過其他途徑解決這個問題。
通過查詢資料得知,我們除了要設定MaxLength屬性以外,特別需要設定屬性EnforceMaxLength 為true
1.
<ext:TextField
ID=
"startSessionTextField"
runat=
"server"
FieldLabel=
"Account"
AllowBlank=
"false"
EnableKeyEvents=
"true"
BlankText=
"The
account is required."
Text=
"XXX"
EnforceMaxLength=
"true"
MaxLength=
"10"
AnchorHorizontal=
"95%"
IndicatorIcon=
"Accept"
Regex=
"^[a-zA-Z0-9]{5,10}$"
RegexText=
"Invalid"
/>
EnforceMaxLength:表示是否在Field的底層設定MaxLength屬性值,預設為false。且只有在ExtJs4.0版本中才提供這個屬性。
這樣一來就很好使用了的。
擴充套件閱讀:
如果您有更好的建議也不妨留言一起交流學習。