ExtJS之Ext.form.field.Number数字输入框

最新推荐文章于 2021-06-25 16:02:05 发布
最新推荐文章于 2021-06-25 16:02:05 发布
阅读量2.8k 收藏 1
点赞数
分类专栏： ext框架

JS文件：

[javascript] view plain copy 在CODE上查看代码片 派生到我的代码片
  1. Ext.onReady(function(){  
  2.   
  3.         Ext.QuickTips.init();  
  4.         var form=new Ext.form.Panel({  
  5.             title:'Ext.form.field.Number示例',  
  6.             bodyStyle:'padding:5',//表单边距  
  7.             renderTo:'form',  
  8.             frame:true,  
  9.             height:150,  
  10.             width:250,  
  11.             defaultType:'numberfield',//设置表单字段的默认类型  
  12.             defaults:{//统一设置表单字段默认属性  
  13.                     labelSeparator:':',//分隔符  
  14.                     labelWidth:80,//标签宽度  
  15.                     width:200,//字段宽度  
  16.                     labelAlign:'left',//标签对齐方式  
  17.                     msgTarget:'side'//在字段的右边显示一个提示信息  
  18.                   
  19.                 },  
  20.                 items:[{  
  21.                     fieldLabel:'整数',  
  22.                     hideTrigger:true,//隐藏微调按钮  
  23.                     allowDecimals:false,//不允许输入小数  
  24.                     nanText:'请输入有效的整数'//无效数字提示  
  25.                 },{  
  26.                     fieldLabel:'小数',  
  27.                     decimalPrecision:2,//精确到小数点后两位  
  28.                     allowDecimals:true,//不允许输入小数  
  29.                     nanText:'请输入有效小数'//无效数字提示  
  30.                 },{  
  31.                   
  32.                     fieldLabel:'数字限制',  
  33.                     baseChars:'12345'//输入数字范围  
  34.                 },{  
  35.                     fieldLabel:'数值限制',  
  36.                     maxValue:100,//最大值  
  37.                     minValue:50//最小值  
  38.                       
  39.                 }]  
  40.               
  41.           
  42.         });  
  43.       
  44. });  
jsp文件：
[java] view plain copy 在CODE上查看代码片 派生到我的代码片
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%  
  3. String path = request.getContextPath();  
  4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
  5. %>  
  6.   
  7. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  8. <html>  
  9.   <head>  
  10.     <base href="<%=basePath%>">  
  11.       
  12.     <title>My JSP 'JS1.jsp' starting page</title>  
  13.       
  14.     <meta http-equiv="pragma" content="no-cache">  
  15.     <meta http-equiv="cache-control" content="no-cache">  
  16.     <meta http-equiv="expires" content="0">      
  17.     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
  18.     <meta http-equiv="description" content="This is my page">  
  19.     <!-- extjs的样式文件 -->  
  20.     <link rel="stylesheet" type="text/css" href="js/extjs/resources/css/ext-all.css">  
  21.     <!-- extjs的核心文件 -->  
  22.     <script type="text/javascript" charset="utf-8" src="js/extjs/ext-all-debug.js"></script>  
  23.     <!-- 国际化文件 -->  
  24.     <script type="text/javascript" charset="utf-8" src="js/extjs/ext-lang-zh_CN.js"></script>  
  25.       
  26.     <script type="text/javascript" charset="utf-8" src="base/009_text.js"></script>  
  27.   
  28.   
  29.   </head>  
  30.     
  31.     
  32.   <body style="margin:10px">  
  33.     <div id="form"></div>   
  34.     <!-- 错误信息展示元素 -->  
  35.     <div id="errorMsg"></div>  
  36.   </body>  
  37. </html> 
周厉
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[Ext JS ]3.4 数字输入框 numberfield
oscar999的专栏
04-08 1314
数字输入框用来输入数字， 可以验证数字在有效范围内。
Ext_数字输入框_Ext.form.NumberField
热门推荐
66
04-11 1万+
<!--/*Ext.form.NumberField独有配置表:allowDecimals Boolean 是否允许输入小数(默认true)allowNegative Boolean 是否允许输入负数(默认true)baseChars String
Ext.form.field.Number数字输入框
weixin_33819479的博客
04-19 197
1、Ext.form.field.Number主要配置项 配置项类型说明 allowDecimals Boolean 是否允许输入小数，默认为true autoStripChars Boolean 是否过滤不允许输入的字符，默认为false baseChars String 输入的有效数字集合，默认为“0123456789” decimal...
无废话ExtJs 入门教程九[数字字段：NumberField、隐藏字段Hidden、日期字段：DataFiedl]...
weixin_30478757的博客
06-23 129
继上第六节内容，我们在表单里加了个一个数字字段，隐藏字段，日期字段。如下代码所: 1.代码如下： 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html...
Ext_数字输入框_Ext.form.NumberField 正则属性梳理
Sucker的小笔记
11-13 1065
&lt;mce:script type="text/javascript"&gt;&lt;!--   /*  Ext.form.NumberField独有配置表:  allowDecimals              Boolean             是否允许输入小数(默认true)  allowNegative              Boolean              是否...
Ext.form.field.Number numberfield
weixin_33860528的博客
11-14 136
A numeric text field that provides automatic keystroke filtering to disallow non-numeric characters, and numeric validation to limit the value to a range of valid numbers.(数据字段提供了自动过滤键盘输入的...
ExtJs的Ext.Ajax.request实现waitMsg等待提示效果
10-19
主要介绍了ExtJs的Ext.Ajax.request实现waitMsg等待提示效果,需要的朋友可以参考下
Ext.ux.form.field.DateTime:ExtJS DateTime字段
05-06
Ext.ux.DateTimeField控件已在Sencha论坛上浮动。 有一些补丁程序使其可用于5.1。 参见此处： : 什么有效 我得到了最新版本，将类重命名为更类似于当前的Ext 5.1架构，并修复了尝试选择时间控件时的错误。 过时的...
extjs-Ext.ux.form.LovCombo下拉框
11-04
在EXTJS框架中，`Ext.ux.form.LovCombo`是一种自定义组件，它扩展了基本的`Ext.form.field.ComboBox`，提供了更丰富的功能，尤其是针对多选和联动选择的需求。这个组件通常用于创建具有“lov”（即“Look Up Value”...
Extjs 继承Ext.data.Store不起作用原因分析及解决
01-19
关于这个原因有很多种，我只说下我遇到的 我这样 写Store来复用的 代码如下: DocStore = Ext.extend(Ext.data.Store,{ initComponent:function(){ this.proxy = new Ext.data.HttpProxy({url:this.url}); this....
ExtJS下 Ext.Direct加载和提交过程排错小结
10-27
基础夯实一点，会有好处的，排错的时候就体现出来了,下面就Ext.Direct做一些排错笔记与大家一一分享，感兴趣的朋友可以参考下哈
Ext NumberField使用
weixin_33699914的博客
07-14 465
Ext.onReady(function(){ Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget="side"; var form = new Ext.form.FormPanel({  title:"Ext.form.NumberField例子",  labelSeparator:":",  labelWidth:60,  body...
Ext.form.NumberField使用
乐乐的专栏
09-24 2733
 this.typeCode= new Ext.form.NumberField({    fieldLabel : '类型代码',         //标签名称    id:"typeCode",                   //字段标识    maxLength : 10,                  //内容的最大长度    width : 200,       
ExtJs 入门教程二十[数字框 ：NumberField]
330553352的专栏
07-03 1323
一、效果 二、代码var chargeupLimit = new Ext.form.NumberField({ fieldLabel : '脱机消费上限(元)', id : 'logTypParam_text4_add', name : 'csklxcszs[4].id.cszzz', width:controlWidth/12, maxValue:20000, minValue
Ext.form.field.Number示例
a304096740的博客
04-24 145
努力奋斗中... 1 //Ext.form.field.Number示例 2 Ext.onReady(function(){ 3 //启动悬窗提示 4 Ext.QuickTips.init(); 5 Ext.create('Ext.form.Panel',{ 6 title:'Ext....
Extjs中numberfield小数位数设置
weixin_30716725的博客
04-01 1751
在默认的情况下，使用numberfield控件时只会显示两位小数，有的时候需要根据业务来确定显示小数的位数。通过设置下面的属性可以达到我们想要的目的： 1 text : '存煤量(万吨)', 2 dataIndex : 'amount', 3 sortable : true, 4 align : 'center', 5 width : 150, 6 editor : {...
Extjs中numberfield输入小数位数设置
qq_37683447的博客
06-25 1044
xtype : 'numberfield', decimalPrecision: 8,//这里设置保留8位小数
ExtJS之Ext.form.field.Number组件实例
superman166的专栏
07-25 1138
ExtJS之Ext.form.field.Number数字输入框组件实现了自动按键过滤和数字验证.在严格要求输入数字的场合有用,免去了编写相关验证的复杂逻辑,是简化编程的典型应用.实例代码如下:            Hello World                                        Ext.onReady(function ()
Ext.form.field.Number的实例
aoan8375的博客
05-23 118
<script type="text/javascript"> Ext.onReady(function(){ Ext.QuickTips.init(); var form =new Ext.form.FormPanel({ title:'Ext.form.field.Number示例', bodyStyle:'padding:5 5 5 5',//表单边距 ...
ExtJs3.0 Ext.form.CheckboxGroup批量取值和设值方法
最新发布
05-24
Ext.form.CheckboxGroup是一个可以包含多个checkbox的组件，可以通过以下方法批量取值和设值： 1. 批量取值： ```javascript var checkboxGroup = Ext.getCmp('checkboxGroupId'); // 获取组件 var values = checkboxGroup.getValue(); // 获取所有选中checkbox的value值，返回一个Array ``` 2. 批量设值： ```javascript var checkboxGroup = Ext.getCmp('checkboxGroupId'); // 获取组件 checkboxGroup.setValue(["value1", "value2", ...]); // 设置多个checkbox的value值，参数为一个Array ``` 其中，'checkboxGroupId'是checkboxGroup组件的id属性值。注意，如果checkbox的value值为数字类型，getValue()方法返回的也是数字类型的数组。如果checkbox的value值为字符串类型，getValue()方法返回的是字符串类型的数组。setValue()方法的参数也需要根据checkbox的value值类型进行设置。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值