Extjs NumberField后面加单位实现思路


Posted in Javascript onJuly 30, 2013

UnitText.js
=======================

// 输入框textfield后面放字unitText定义: 
Ext.override(Ext.form.TextField, { 
unitText : '', 
onRender : function(ct, position) { 
Ext.form.TextField.superclass.onRender.call(this,ct, position); if (this.unitText != ''){ 
this.unitEl =ct.createChild({ 
tag: 'div', 
html: this.unitText this.unitEl.addClass('x-form-unit'); this.width =this.width 
-(this.unitText.replace(/[^\x00-\xff]/g, "xx").length * 6 +2); this.alignErrorIcon= function() { 
this.errorIcon.alignTo(this.unitEl,'tl-tr', [2, 0]); }});

将UnitText.js放入到jsp文件中,加上css样式,如下:
<style> 
.x-form-unit{ 
height:22px; 
line-height:22px; 
padding-left:2px; 
display:inline-block; 
display:inline; </style> 
<script type="text/javascript"src="UnitText.js"></script>

这样就可以用了,使用方法如下:
var jine = new Ext.form.NumberField({ 
id: 'je', 
fieldLabel: '金额', 
allowDecimals: true, // 允许小数点? 
allowNegative: false, // 允许负数? 
width: 100, 
style: 'text-align:right', 
unitText: ' 元' 
});
Javascript 相关文章推荐
基于jquery实现图片广告轮换效果代码
Jul 07 Javascript
JavaScript 参数中的数组展开 [译]
Sep 21 Javascript
JS获取url链接字符串 location.href
Dec 23 Javascript
json+jQuery实现的无限级树形菜单效果代码
Aug 27 Javascript
分享我对JS插件开发的一些感想和心得
Feb 04 Javascript
js eval函数使用,js对象和字符串互转实例
Mar 06 Javascript
jQuery插件zTree实现更新根节点中第i个节点名称的方法示例
Mar 08 Javascript
Javascript 一些需要注意的细节(必看篇)
Jul 08 Javascript
微信小程序实现运动步数排行功能(可删除)
Jul 05 Javascript
vue 根据选择条件显示指定参数的例子
Nov 09 Javascript
element中的$confirm的使用
Apr 26 Javascript
JS继承实现方法及优缺点详解
Sep 02 Javascript
Js中获取frames中的元素示例代码
Jul 30 #Javascript
js中的屏蔽的使用示例
Jul 30 #Javascript
使用js正则控制input标签只允许输入的值
Jul 29 #Javascript
js为鼠标添加右击事件防止默认的右击菜单弹出
Jul 29 #Javascript
js保留两位小数使用toFixed实现
Jul 29 #Javascript
jquery图片不完全按比例自动缩小的简单代码
Jul 29 #Javascript
jquery验证手机号码、邮箱格式是否正确示例代码
Jul 28 #Javascript
You might like
jQuery中的RadioButton,input,CheckBox取值赋值实现代码
2014/02/18 PHP
php上传文件常见问题总结
2015/02/03 PHP
给PHP开发者的编程指南 第一部分降低复杂程度
2016/01/18 PHP
在JavaScript中,为什么要尽可能使用局部变量?
2009/04/06 Javascript
jQuery 开天辟地入门篇一
2009/12/09 Javascript
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
2010/12/11 Javascript
禁用页面部分JavaScript不是全部而是部分
2014/09/03 Javascript
基于Javascript实现弹出页面效果
2016/01/01 Javascript
Bootstrap分页插件之Bootstrap Paginator实例详解
2016/10/15 Javascript
简述JS控制台的使用
2018/07/15 Javascript
JQuery通过后台获取数据遍历到前台的方法
2018/08/13 jQuery
详解js访问对象的属性和方法
2018/10/25 Javascript
ES10 特性的完整指南小结
2019/03/04 Javascript
es6函数之尾递归用法实例分析
2020/04/25 Javascript
uni-app微信小程序登录授权的实现
2020/05/22 Javascript
python动态网页批量爬取
2016/02/14 Python
Python3 串口接收与发送16进制数据包的实例
2019/06/12 Python
python使用HTMLTestRunner导出饼图分析报告的方法
2019/12/30 Python
Python pandas如何向excel添加数据
2020/05/22 Python
pip/anaconda修改镜像源,加快python模块安装速度的操作
2021/03/04 Python
CSS3模块的目前的状况分析
2010/02/24 HTML / CSS
美国手机支架公司:PopSockets
2019/11/27 全球购物
启动一个线程是用run()还是start()
2016/12/25 面试题
2013年办公室秘书的个人自我鉴定
2013/10/24 职场文书
文明学生标兵事迹
2014/01/21 职场文书
校运会广播稿100字
2014/01/27 职场文书
体育专业求职信
2014/07/16 职场文书
活动总结格式
2014/08/30 职场文书
银行转正自我鉴定
2014/09/29 职场文书
2014年社区党建工作汇报材料
2014/11/02 职场文书
关于群众路线的心得体会
2014/11/05 职场文书
2015年学校信息技术工作总结
2015/05/25 职场文书
安全教育培训心得体会
2016/01/15 职场文书
《语言的突破》读后感3篇
2019/12/12 职场文书
python-opencv 中值滤波{cv2.medianBlur(src, ksize)}的用法
2021/06/05 Python
MySQL连表查询分组去重的实现示例
2021/07/01 MySQL