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 相关文章推荐
Google Suggest ;-) 基于js的动态下拉菜单
Oct 11 Javascript
调用DOM对象的focus使文本框获得焦点
Feb 19 Javascript
Jquery 返回json数据在IE浏览器中提示下载的问题
May 18 Javascript
JavaScript判断一个字符串是否包含指定子字符串的方法
Mar 18 Javascript
javascript实现状态栏文字首尾相接循环滚动的方法
Jul 22 Javascript
JS框架之vue.js(深入三:组件1)
Sep 29 Javascript
js将table的每个td的内容自动赋值给其title属性的方法
Oct 13 Javascript
JS简单实现移动端日历功能示例
Dec 28 Javascript
JS获得一个对象的所有属性和方法实例
Feb 21 Javascript
Angular.JS去掉访问路径URL中的#号详解
Mar 30 Javascript
利用PM2部署node.js项目的方法教程
May 10 Javascript
vue实现路由懒加载及组件懒加载的方式
Jun 11 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
文件上传类
2006/10/09 PHP
PHP实现单例模式最安全的做法
2014/06/13 PHP
浅谈php安全性需要注意的几点事项
2014/07/17 PHP
php的ZipArchive类用法实例
2014/10/20 PHP
php实现压缩合并js的方法【附demo源码下载】
2016/09/22 PHP
PHP时间处理类操作示例
2018/09/05 PHP
小程序微信支付功能配置方法示例详解【基于thinkPHP】
2019/05/05 PHP
JavaScript 获取用户客户端操作系统版本
2009/08/25 Javascript
js防止表单重复提交的两种方法
2013/09/30 Javascript
用javascript为页面添加天气显示实现思路及代码
2013/12/02 Javascript
自定义jQuery插件方式实现强制对象重绘的方法
2015/03/23 Javascript
javascript基于prototype实现类似OOP继承的方法
2015/12/16 Javascript
利用Javascript仿Excel的数据透视分析功能
2016/09/07 Javascript
微信小程序 简单DEMO布局,逻辑,样式的练习
2016/11/30 Javascript
jQuery电话号码验证实例
2017/01/05 Javascript
微信小程序实现搜索历史功能
2020/03/26 Javascript
JS实现图片切换特效
2019/12/23 Javascript
antd多选下拉框一行展示的实现方式
2020/10/31 Javascript
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
简介Python中用于处理字符串的center()方法
2015/05/18 Python
Python实现删除当前目录下除当前脚本以外的文件和文件夹实例
2015/07/27 Python
python解决pandas处理缺失值为空字符串的问题
2018/04/08 Python
对numpy Array [: ,] 的取值方法详解
2018/07/02 Python
python判断计算机是否有网络连接的实例
2018/12/15 Python
Numpy对数组的操作:创建、变形(升降维等)、计算、取值、复制、分割、合并
2019/08/28 Python
Python pip install如何修改默认下载路径
2020/04/29 Python
微软俄罗斯官方网站:Microsoft俄罗斯
2016/09/18 全球购物
Troy-Bilt官网:草坪割草机、吹雪机、分蘖机等
2019/02/19 全球购物
.NET现在共支持多少种语言
2014/02/26 面试题
大一自我鉴定范文
2013/12/27 职场文书
建筑班组长岗位职责
2014/01/02 职场文书
一年级班主任寄语
2014/01/19 职场文书
教师四风对照检查材料思想汇报
2014/09/17 职场文书
2015年消费者权益日活动总结
2015/02/09 职场文书
《开国大典》教学反思
2016/02/16 职场文书
PHP中国际化的字符串排序和比较对象详解
2021/08/23 PHP