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的Theme和Theme Switcher使用小结
Sep 08 Javascript
js RuntimeObject() 获取ie里面自定义函数或者属性的集合
Nov 23 Javascript
js数组Array sort方法使用深入分析
Feb 21 Javascript
JS中的substring和substr函数的区别说明
May 07 Javascript
jquery validate 自定义验证方法介绍 日期验证
Feb 27 Javascript
js 显示base64编码的二进制流网页图片
Apr 04 Javascript
JS实现1000以内被3或5整除的数字之和
Feb 18 Javascript
详解Vue2.x-directive的学习笔记
Jul 17 Javascript
Vue2.0学习之详解Vue 组件及父子组件通信
Dec 12 Javascript
详解vue-cli之webpack3构建全面提速优化
Dec 25 Javascript
深入理解ES6中let和闭包
Feb 22 Javascript
小程序识别身份证,银行卡,营业执照,驾照的实现
Nov 05 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
浅谈ThinkPHP的URL重写
2014/11/25 PHP
php实现批量修改文件名称的方法
2016/07/23 PHP
PHP在线打包下载功能示例
2016/10/15 PHP
js 禁用浏览器的后退功能的简单方法
2008/12/10 Javascript
基于Jquery的简单&amp;简陋Tabs插件代码
2010/02/09 Javascript
jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
2010/03/21 Javascript
JS实现倒计时和文字滚动的效果实例
2014/10/29 Javascript
Nodejs中session的简单使用及通过session实现身份验证的方法
2016/02/04 NodeJs
Node.js中常规的文件操作总结
2016/10/13 Javascript
微信小程序 页面跳转传递值几种方法详解
2017/01/12 Javascript
PHP7新特性简述
2017/06/11 Javascript
关于Vue背景图打包之后访问路径错误问题的解决
2017/11/03 Javascript
详解nuxt路由鉴权(express模板)
2018/11/21 Javascript
layui扩展上传组件模拟进度条的方法
2019/09/23 Javascript
javascript网页随机点名实现过程解析
2019/10/15 Javascript
[04:47]DOTA2-潍坊风行电子俱乐部探秘
2014/08/08 DOTA
python计算最小优先级队列代码分享
2013/12/18 Python
Python MySQL数据库连接池组件pymysqlpool详解
2017/07/07 Python
selenium+python自动化测试之页面元素定位
2019/01/23 Python
python控制nao机器人身体动作实例详解
2019/04/29 Python
解决python super()调用多重继承函数的问题
2019/06/26 Python
Django如何实现上传图片功能
2019/08/16 Python
美国知名的在线旅游服务网站:Priceline
2016/07/23 全球购物
日本高端护肤品牌:Tatcha
2016/08/29 全球购物
加拿大最大的箱包及旅游配件零售商:Bentley Leathers
2017/07/19 全球购物
韩国美国时尚服装和美容在线全球市场:KOODING
2018/11/07 全球购物
网友共享的几个面试题关于Java和Unix等方面的
2016/09/08 面试题
财务管理专业推荐信
2013/11/19 职场文书
银行见习期自我鉴定
2014/01/29 职场文书
个人授权委托书范本格式
2014/10/12 职场文书
承诺书范本大全
2015/05/04 职场文书
惊涛骇浪观后感
2015/06/05 职场文书
地雷战观后感
2015/06/09 职场文书
住房公积金贷款工资证明
2015/06/12 职场文书
《狼牙山五壮士》教学反思
2016/02/17 职场文书
银行求职信范文
2019/05/13 职场文书