Extjs Catch 选择事件（组合框）

Question

使用 ExtJS 4.2.3。我有带有组合框字段的 FORM 和一些内部选择的值。当用户在组合框中选择 1 个值时，我需要捕获事件。寻求语法方面的帮助，例如在选择 DATA3 值时获得警报。组合框字段的名称 - “document_type”.

ExtJS 代码示例：

        documentForm_window = Ext.create("Ext.window.Window", {
            title: (document_GUID == null) ? "[Create]" : "[Edit]",
            width: 500,
            modal: true,
            layout: "fit",
            items: [{
                xtype: "form",
                frame: true,
                waitMsgTarget: true,
                listeners: {
                    afterrender: function (form) {
                        if (document_GUID != null) {
                            form.getForm().load({
                                url: Ext.state.Manager.get("MVC_url") + "/Document/Get",
                                method: "GET",
                                params: { document_GUID: document_GUID },
                                waitMsg: "[loading]",
                                timeout: 300,
                                failure: function (form, action) {
                                    if (action.result) Ext.Msg.alert("[Error1]!", action.result.errorMessage);
                                    else Ext.Msg.alert("[Error2]!", "[Error3]!");
                                }
                            });
                        }
                    }
                },
                defaults: {
                    anchor: "100%",
                    msgTarget: "side",
                    labelWidth: 145,
                    allowBlank: false
                },
                items: [{
                    xtype: "combo",
                    name: "document_type",
                    fieldLabel: "<b>[Type]<font color='Red'>*</font></b>",
                    displayField: "document_type_name",
                    valueField: "document_type",
                    queryMode: "local",
                    triggerAction: "all",
                    editable: false,
                    store: document_store
                }, {
                    xtype: "textfield",
                    name: "contract_number",
                    fieldLabel: "<b>[TestData]</b>"

                }],
                formBind: true,
                buttons: [{
                    text: (document_GUID == null) ? "[Create]" : "[Edit]",
                    handler: function () {
                        var action = (document_GUID == null) ? "Create" : "Edit";

                        var form = this.up("form").getForm();
                        if (form.isValid()) {
                            form.submit({
                                url: Ext.state.Manager.get("MVC_url") + "/Document/" + action,
                                params: { document_GUID: document_GUID, treasury_GUID: tree_value },
                                waitMsg: "[Loading...]",
                                success: function (form, action) {
                                    documentForm_window.destroy();
                                    OrderLines_store.load({
                                        scope: this,
                                        callback: function (records, operation, success) {
                                            documents_List.query('*[itemId="DATA1_grid"]')[0].selModel.select(curr_position);
                                        }
                                    });
                                },
                                failure: function (form, action) {
                                    if (action.result) Ext.Msg.alert("[Error1]!", action.result.msg);
                                    else Ext.Msg.alert("[Error2]!", "[Error3]!");
                                }
                            });
                        }
                    }
                }]
            }]
        }).show();
    }
//store//   
     document_store = new Ext.data.ArrayStore({
        fields: ["document_type", "document_type_name"],
        data: [[0, "data1"], [1, "data2"], [2, "data3"]]   
    });

抱歉，我添加的部分代码是 post 错误 "It looks like your post is mostly code" 的屏幕原因。

Answer 1

您必须将 select event 的侦听器添加到组合框：

editable: false,
store: document_store,
listeners: {
    select: function(combo, records) {
        console.log(combo);
        console.log(records);
        if(!Ext.isArray(records)) records = [records];
        Ext.each(records, function(record) {
            if(record.get(combo.valueField)==3) {
               Ext.Msg.alert('Value is 3 for' + record.get(combo.displayField));
            }
        });
    }
}

Extjs Catch 选择事件（组合框）

Extjs Catch pick event (combobox)

javascript

combobox

extjs

extjs4

web