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：通過調節按鈕、鍵盤、鼠標滾輪調節數值時的大小