Ext.form.field.Trigger触发字段

1、Ext.form.field.Trigger主要配置

配置项类型说明
editable Boolean 是否允许直接对文本进行编辑,false则不允许编辑,只能通过触发按钮进行设置,默认为true
hideTrigger Boolean 是否隐藏触发按钮,默认为false
repeatTriggerClick Boolean true则添加一个click repeater到触发按钮上,默认为false
readOnly Boolean 字段是否只读,true则阻止用户修改字段内容,并隐藏触发按钮,默认为false
repeatTriggerClick Boolean true则自动添加一个重复点击器
selectOnFocus Boolean 在获得焦点时是否立即选中输入框已经存在的文本,默认为false。该配置只在editable为true时生效

2、Ext.form.field.Trigger示例

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.form.field.Trigger示例</title>
    <link href="ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
    <script src="ext-4.0.7-gpl/bootstrap.js" type="text/javascript"></script>
    <script type="text/javascript">
        Ext.onReady(function () {
            var frm = new Ext.form.Panel({
                title: "Ext.form.field.Trigger示例",
                bodyStyle: "padding:5",
                frame: true,
                height: 100,
                width: 240,
                renderTo: Ext.getBody(),
                defaults: {
                    labelSeparator: "",
                    labelWidth: 80,
                    width: 230,
                    labelAlign: "left"
                },
                items: [{
                    xtype: "triggerfield",
                    id: "memo",
                    fieldLabel: "触发字段",
                    hideTrigger: false,
                    onTriggerClick: function () {
                        var memo = frm.getForm().findField("memo");
                        Ext.MessageBox.alert(memo.getValue());
                        Ext.getCmp("memo").setValue("Test");
                    }
                }]
            });
        });
    </script>
</head>
<body>
</body>
</html>

效果图:

posted @ 2012-04-22 00:50  libingql  阅读(8326)  评论(0编辑  收藏  举报