ExtJs之TriggerField和SpinnerField控件实例

最新推荐文章于 2020-12-20 11:55:40 发布

Vezn

最新推荐文章于 2020-12-20 11:55:40 发布

阅读量1.8k

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/Vezn_King/article/details/54103534

版权

前端专栏收录该内容

26 篇文章 0 订阅

订阅专栏

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
    <link href="Ext4.2/resources/css/ext-all.css" rel="stylesheet" />
    <script src="Ext4.2/bootstrap.js"></script>
    <script>
        Ext.onReady(function(){
            var testForm = new Ext.form.Panel({
                title: 'Trigger实例',
                bodyStyle: 'padding:5',
                frame: true,
                height: 100,
                width: 270,
                renderTo: 'form',
                defaults: { //统一设置表单字段默认属性
                    labelSeparator: ':',//分隔符
                    labelWidth: 80, //标签宽度
                    width: 200, //字段宽度
                    labelAlign: 'left' //标签对齐方式

                },
                items: [{
                    xtype: 'triggerfield',
                    id: 'meno',
                    fieldLabel: '触发字段',
                    hideTrigger: false,//不隐藏触发按钮
                    onTriggerClick: function () {
                        var meno = testForm.getForm().findField('meno');//取得输入控件
                        alert(meno.getValue());//取得控件值
                        Ext.getCmp('meno').setValue('test');
                    }
                },
                {
                    xtype: 'spinnerfield',
                    id: 'salary',
                    fieldLabel: '微调字段',
                    onSpinUp: function () {
                        var salaryCmp = Ext.getCmp('salary');
                        salaryCmp.setValue(Number(salaryCmp.getValue()) + 1);
                    },
                    onSpinDown:function()
                    {
                        var salaryCmp = Ext.getCmp('salary');
                        salaryCmp.setValue(Number(salaryCmp.getValue()) - 1);
                    }
                }
                ]
            });
        })
    </script>
</head>
<body>
    <div id="form"></div>
</body>
</html>

Vezn

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ExtJs之TriggerField和SpinnerField控件实例

Ext.onReady(function(){ var testForm = new Ext.form.Panel({ title: 'Trigger实例', bodyStyle: 'padding:5', frame: true, height:
复制链接

扫一扫