手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Extjs中DisplayField的日期或者数字格式化扩展
Extjs中DisplayField的日期或者数字格式化扩展
摘要:使用Ext.form.FormPanel来处理数据时候,某些字段是需要只读的。当然我们可以使用Ext.form.TextField,然后设置...

使用 Ext.form.FormPanel 来处理数据时候,某些字段是需要只读的。当然我们可以使用 Ext.form.TextField,然后设置成 ReadOnly,不过这样子的显示效果不是很好,因为始终会有个输入框。所以我们必须使用 Ext.form.DisplayField,但是 Ext.form.DisplayField 没有一个format的属性,也不具备 renderer 这个事件,比如日期字段 var form = new Ext.form.FormPanel({

frame: true,

renderTo: 'form-div',

items: [{ xtype: 'displayfield', fieldLabel: 'Date', value: new Date() }]

});

那它显示的就有点不正确了

Extjs中DisplayField的日期或者数字格式化扩展1

那么我们可以重写一下 Ext.form.DisplayField,让他支持 format 属性

Ext.override(Ext.form.DisplayField, { getValue: function () { return this.value; }, setValue: function (v) { this.value = v; this.setRawValue(this.formatValue(v)); return this; }, formatValue: function (v) { if (this.dateFormat && Ext.isDate(v)) { return v.dateFormat(this.dateFormat); } if (this.numberFormat && typeof v == 'number') { return Ext.util.Format.number(v, this.numberFormat); } return v; } }); 我们给 Ext.form.DisplayField 加了两个属性: dateFormat 和 numberFormat,然后我们将上面的 FormPanel 改一下

var form = new Ext.form.FormPanel({

frame: true,

renderTo: 'form-div',

items: [{

xtype: 'displayfield',

fieldLabel: 'Date',

value: new Date(),

dateFormat: 'm/d Y'

}]

});

Extjs中DisplayField的日期或者数字格式化扩展2

应该还是比较 perfect 的,哈哈哈

【Extjs中DisplayField的日期或者数字格式化扩展】相关文章:

javascript实现表格增删改操作实例详解

日期函数扩展类Ver0.1.1

javascript实现日期按月份加减

详解AngularJS中$http缓存以及处理多个$http请求的方法

jQuery实现dialog设置focus焦点的方法

javascript每日必学之运算符

你一定会收藏的Nodejs代码片段

JQuery中基础过滤选择器用法

图片之间的切换

Javascript中的Prototype到底是什么

精品推荐
分类导航