ExtJS numberfield textfield用法

textfield的用法示例

var formCmp = Ext.create("Ext.form.Panel", {
    title: "NumberField用法示例", x: 30, y: 30, width: 500, height: 300, bodyPadding: 5, frame: true, defaultType: "textfield", fieldDefaults: { labelAlign: "right", labelWidth: 60, msgTarget: "qtip" }, defaults: { anchor: "100%" }, items: [ { //控件类型为numberfield xtype: "numberfield", //字段名称,绑定和获取数据的时候用到 name: "month", //显示的标签 fieldLabel: "月份", //控件的值 value: 1, //能否为空,true为必填项,false为可以为空 allowBlank: false, //最大值 maxValue: 12, //最小值 minValue: 1, //获得焦点时选中输入的内容 selectOnFocus: true, //是否只读,true为只读,false为可编辑 readOnly: false, //是否可用,true为不可用,false为可用 disabled: false, //是否隐藏上下调节按钮 hideTrigger: false, //键盘导航是否可用,启用后可以通过键盘的上下箭头调整数值 keyNavEnabled: true, //鼠标滚轮是否可用,启用后可以通过滚动鼠标滚轮调整数值 mouseWheelEnabled: true, //通过调节按钮、键盘、鼠标滚轮调节数值时的大小 step: 2 } ], listeners: { change: function (me, newValue, oldValue, eOpts) { Ext.MessageBox.alert("提示", newValue); } }, renderTo: "container" });

NumberField事例
在Form中使用NumberField字段,作为form的一个item,如果form的defaultType不是numberfield,那么需要首先将xtype设置为numberfield。
  • name:字段名称,绑定和获取数据的时候用到
  • fieldLabel:显示的标签
  • value:控件的值
  • allowBlank:能否为空,true为必填项,false为可以为空
  • maxValue:最大值
  • minValue:最小值
  • selectOnFocus:获得焦点时选中输入的内容
  • readOnly:是否只读,true为只读,false为可编辑
  • disabled:是否可用,true为不可用,false为可用

numberfield特有的配置:

  • hideTrigger:是否隐藏上下调节按钮
  • keyNavEnabled:键盘导航是否可用,启用后可以通过键盘的上下箭头调整数值
  • mouseWheelEnabled:鼠标滚轮是否可用,启用后可以通过滚动鼠标滚轮调整数值
  • step:通过调节按钮、键盘、鼠标滚轮调节数值时的大小
 
 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值