Question

我在extjs中有两个下拉列表，基于第一个dropdwon，第二个下拉列表填充。这工作正常，我能够将值传递给springMVC，但是当我必须隐藏/取消隐藏基于的文本字段时出现问题第二个下拉列表，隐藏/取消隐藏工作正常，但我无法将参数传递给SpringMVC。这是我的.js文件。任何人都可以告诉我必须纠正的地方，

Ext.Loader.setConfig({
enabled: true
});
Ext.require(['*']);

var country = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data: [{
    "abbr": "USA",
    "name": "USA"
}, {
    "abbr": "UK",
    "name": "UK"
},


]
});

var states = Ext.create('Ext.data.Store', {
fields: ['id', 'abbr', 'name'],
data: [{
    "id": "New York",
    "abbr": "USA",
    "name": "New York"
}, {
    "id": "New Jersey",
    "abbr": "USA",
    "name": "New Jersey"
}, {
    "id": "London",
    "abbr": "UK",
    "name": "London"
}, {
    "id": "Hampshire",
    "abbr": "UK",
    "name": "Hampshire"
}]
});
Ext.define('App.view.countryPanel', {
extend: 'Ext.form.Panel',
alias: 'widget.CountryPanel',
id: 'countrypanel',


title: 'Country',
frame: true,
width: 400,
fieldDefaults: {
    labelWidth: 200
},
bodyPadding: '15 16 10',

height: 200,
id: 'countrypanel',

method: 'POST',




items: [



{
    xtype: 'combo',
    id: 'con',
    name: 'con',
    fieldLabel: 'Country',
    displayField: 'name',

    emptyText: 'Select a Country',
    valueField: 'abbr',
    store: country,
    listeners: {
        'select': {
            fn: function (combo, value) {

                var comboState = Ext.getCmp('statelist');
                comboState.bindStore(states);
                comboState.clearValue();
                comboState.store.filter('abbr', combo.getValue());

                states = Ext.create('Ext.data.Store', {
                    fields: ['id', 'abbr', 'name'],
                    data: [{
                        "id": "New York",
                        "abbr": "USA",
                        "name": "New York"
                    }, {
                        "id": "New Jersey",
                        "abbr": "USA",
                        "name": "New Jersey"
                    }, {
                        "id": "London",
                        "abbr": "UK",
                        "name": "London"
                    }, {
                        "id": "Hampshire",
                        "abbr": "UK",
                        "name": "Hampshire"
                    }]
                });



            }
        }
    }
}, {
    xtype: 'combo',
    id: 'statelist',
    name: 'statelist',
    fieldLabel: 'Stated',
    displayField: 'name',
    emptyText: 'Select states',
    valueField: 'id',
    store: states,
    listeners: {
        'select': {
            fn: function (combo, value) {
                var sample = combo.getValue();




                if (sample == 'London') {


                    Ext.getCmp('Tower').getEl().show();


                } else {

                    Ext.getCmp('Tower').getEl().hide();
                    Ext.getCmp('Liberty').getEl().show();

                }


                var comboState = Ext.getCmp('statelist');
                comboState.bindStore(states);
                comboState.clearValue();
                comboState.store.filter('abbr', combo.getValue());



            }
        }
    }
}, {
    xtype: 'textfield',
    id: 'Tower',
    name: 'Tower',
    fieldLabel: 'ClockTower',
    hidden: true,

    allowBlank: false

}, {
    xtype: 'textfield',
    id: 'Liberty',
    name: 'Liberty',
    fieldLabel: 'Liberty',
    hidden: true,
    minWidth: 20,
    allowBlank: false

}],
buttonAlign: 'center',
buttons: [

{
    text: 'Submit',
    handler: function () {

        var sspanel = Ext.getCmp('countrypanel');
        var form = sspanel.getForm();


        form.submit({


            url: 'country.htm',


            success: function (form, action) {


                Ext.Msg.alert('Success');




            },

            failure: function (form, action) {

                Ext.Msg.alert('failure');
            }



        });


    }

},

{

    text: 'Reset',
    handler: function () {
        var sspanel = Ext.getCmp('countrypanel');
        var form = sspanel.getForm();
        form.reset();
    }
}

]

});

Answer 1

尝试对文本字段使用hideMode配置选项：

{
    xtype: 'textfield',
    id: 'Liberty',
    name: 'Liberty',
    fieldLabel: 'Liberty',
    hidden: true,
    hideMode: 'visibility', // you may also use 'offsets' 
    minWidth: 20,
    allowBlank: false
}

在这种情况下，字段的值将作为参数传递。

ExtJS：基于组合框值隐藏和取消隐藏字段并将其传递给springMVC

1 个答案: