Extjs4中的Ext.form.field.Spinner

Extjs4中的Ext.form.field.Spinner

1          //Ext.form.field.Spinner示例
2         Ext.onReady(function(){
3             Ext.create('Ext.form.Panel',{
4                 title:'Ext.form.field.Spinner示例',
5                 bodyStyle:'padding:5 5 5 5',//表单边距
6                 frame : true,
7                 height:140,
8                 width:250,
9                 renderTo :Ext.getBody(),
10                 defaults:{//统一设置表单字段默认属性
11                     labelSeparator :'：',//分隔符
12                     width : 200,//字段宽度
13                     labelAlign : 'left'//标签对齐方式
14                 },
15                 items:[{
16                     xtype : 'spinnerfield',
17                     fieldLabel:'微调字段',
18                     id : 'salary',//组件id
19                     value : 100,//初始化字段值
20                     onSpinUp : function(){
21                         var salaryCmp = Ext.getCmp('salary');//通过组件id获取组件对象
22                         //增加默认值
23                         salaryCmp.setValue(Number(salaryCmp.getValue()) + 1);
24                     },
25                     onSpinDown : function(){
26                         var salaryCmp = Ext.getCmp('salary');
27                         //减小默认值
28                         salaryCmp.setValue(Number(salaryCmp.getValue()) - 1);
29                     }
30                 },{
31                     xtype:'numberfield',
32                     fieldLabel:'这个貌似也行',
33                     value:100
34
35                     }]
36             });
37
38         });
39