关于javascript:当forceSelection = true且用户可以编辑组合框时,请重置组合框

 2021-04-09 

Reset combobox when forceSelection = true and user can edit the combobox

我有一个配置为'forceSelection:true'的组合框。用户可以编辑组合框,例如:输入任意文本,然后立即单击"重置"按钮以重置组合框,但是组合框不会重置为原始值。我该如何解决?

这是我描述问题的代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
var states = Ext.create('Ext.data.Store', {

    fields: ['abbr', 'name'],

    data : [

        {"abbr":"AL","name":"Alabama"},
        {"abbr":"AK","name":"Alaska"},
        {"abbr":"AZ","name":"Arizona"}
        //...
    ]
   });

   Ext.create('Ext.container.Container', {

    layout: 'hbox',

    margin: '50',

    renderTo: Ext.getBody(),

    items: [
        {
            xtype: 'combobox',
            margin: '0 10 0 0',
            fieldLabel: 'Choose State',
            forceSelection: true,
            store: states,
            queryMode: 'local',
            value: 'AL',
            displayField: 'name',
            valueField: 'abbr'

        },
        {
            xtype: 'button',
            text: 'reset',
            handler: function () {
                this.up('container').down('combobox').reset();
            }
        }
    ]
   });
   });

嗨,Plz用这些代码更新了按钮处理程序,即使启用了foreceSelection,它在我端也能正常工作。

1
2
3
4
5
6
7
8
9
10
                        {
                            xtype: 'button',
                            text: 'reset',
                            handler: function () {
                                  var combo=this.up('container').down('combobox');
                                  combo.lastSelection ="Alabama";
                                  combo.setRawValue(combo.lastSelection);
                                  combo.callParent(arguments)
                            }
                        }


尝试这些示例。.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
                Ext.onReady(function(){

                  var states = Ext.create('Ext.data.Store', {

                    fields: ['abbr', 'name'],

                    data : [

                        {"abbr":"AL","name":"Alabama"},
                        {"abbr":"AK","name":"Alaska"},
                        {"abbr":"AZ","name":"Arizona"}
                        //...
                    ]
                   });

                   Ext.create('Ext.container.Container', {

                    layout: 'hbox',

                    margin: '50',

                    renderTo: Ext.getBody(),

                    items: [
                        {
                            xtype: 'combobox',
                            margin: '0 10 0 0',
                            fieldLabel: 'Choose State',
                            store: states,
                            queryMode: 'local',
                            value: 'AL',
                            displayField: 'name',
                            valueField: 'abbr'

                        },
                        {
                            xtype: 'button',
                            text: 'reset',
                            handler: function () {
                                 this.up('container').down('combobox').setValue("Alabama");
                            }
                        }
                    ]
                   });
                 });