Extjs Combo - 为啥在我没有创建表单时加载组合包含组合

Posted 2023-02-26

【中文标题】Extjs Combo - 为啥在我没有创建表单时加载组合包含组合

【英文标题】：Extjs Combo - Why combo is loading while I have not created form include comboExtjs Combo - 为什么在我没有创建表单时加载组合包含组合

【发布时间】：2013-07-09 09:19:30

【问题描述】：

我定义了一个窗口，包括一个表单和一些字段和组合框。比如

    Ext.define('Ext.example.ABC', 
        extend: 'Ext.window.Window',   
        items:
            xtype:'form',
            items:[
            
            xtype: 'combo',
            id: 'example',
            name: 'ax',
            triggerAction:  'all',
            forceSelection: true,
            editable:       false,
            allowBlank: false,
            fieldLabel:     'example',
            mode: 'remote',
            displayField:'name',
            valueField: 'id',
            store: Ext.create('Ext.data.Store', 
                            fields: [
                                name: 'id',
                                name: 'name'
                            ],
                            autoLoad: true,
                            proxy: 
                                type: 'ajax',
                                url: 'example.php',
                                reader: 
                                    type: 'json',
                                    root: 'rows'
                                
                            
                
            )
            ]
         
         ,load: function(a) 
              // do some thing
         
);

我在 网格面板中有一个按钮

tbar:[
            
            text:'create',
            handler:function()
                         var x = new Ext.example.ABC();
                 x.load(0);

            
        

但是为什么当我刚刚启动 gridpanel 然后组合也加载而我没有点击按钮 create。 我有很多组合框，这使我的网格面板加载缓慢:( 怎么解决呢，谢谢

【参考方案1】：

我猜你需要为组合框的store 设置autoLoad: false 配置选项。

---

关于您的 cmets - 我创建了一个示例。你可以在jsFiddle查看。 它是在 ExtJs 3.4 上创建的，但我认为对于 4.x，它不会有太大的不同。

var arrTestData = [
    ['AL', 'Alabama', 'The Heart of Dixie'],
    ['AK', 'Alaska', 'The Land of the Midnight Sun'],
    ['AZ', 'Arizona', 'The Grand Canyon State'],
    ['AR', 'Arkansas', 'The Natural State'],
    ['CA', 'California', 'The Golden State']
];

var combosCount = 5;
var arrItems = [];
for (var i = 0; i < combosCount; i++) 
    var comboId = Ext.id();

    // simple array store
    var store = new Ext.data.ArrayStore(
        parentCombo: comboId,
        fields: ['abbr', 'state', 'nick'],
        data : []
    );

    store.on('load', function() 
        var combo = Ext.getCmp(this.parentCombo);
        combo.setValue(combo.defaultValue);
    );

    var combo = new Ext.form.ComboBox(
        id: comboId,
        fieldLabel: 'Combobox #' + (i + 1),
        store: store,
        displayField:'state',
        valueField:'abbr',
        typeAhead: true,
        mode: 'local',
        forceSelection: true,
        triggerAction: 'all',
        emptyText:'Select a state...',
        defaultValue: arrTestData[i][0],
        selectOnFocus:true
    );
    arrItems.push(combo);


var formPanel = new Ext.form.FormPanel(
    bodyStyle: 'padding:5px;',
    items: arrItems,
    renderTo: 'combos-container'
);


new Ext.Button(
    text: 'Do all cool things',
    renderTo: 'combos-btn',
    handler: function() 
        var arrCombos = formPanel.findByType('combo');
        Ext.each(arrCombos, function(combo)
            combo.getStore().loadData(arrTestData);
        );
    
);

所以我们在那里做什么： 1. 对于每个商店，我们将保存父组合框 ID - 这是识别相关组合框所必需的。 2. 对于每个组合框，我们保存自己的参数 - defaultValue。这是我们希望在加载商店后设置为默认值。 3. 监听'load'事件并为combo设置默认值。

我希望这就是你所等待的:)

【讨论】：

但是我想设置一个默认值如果设置 autoLoad: false 那么什么都没有:(

您可以使用value 配置选项设置组合框的默认值。那时，商店必须拥有所有必需的数据。我认为您需要手动运行存储加载以及何时接收数据-> 为组合设置值。

你有什么例子吗？ b/c 我有很多组合框（大约 5 个）:(

我觉得你的编辑很酷，但我使用 url 来获取数据。你可以让一个对话框等待所有组合加载完成吗？ .非常感谢

我不确定出了什么问题。我们分别将数据加载到组合框。例如。您可以使用autoload + 真实网址。对于每个商店，我们都会监听load 事件，这意味着我们将仅在接收到数据时运行我们的代码。如果您不想自动加载组合框 -> 将 autoLoad 设置为 false 为组合框的每个商店。并在需要时运行store.reload()。

【参考方案2】：

拥有autoLoad:false 并手动加载您的商店以获取默认值。 当你真的想加载商店时，你可以这样做

store.load()

它将加载您的商店以获取默认值。

【讨论】：

但是我的所有商店（组合）加载完成后还是要赶上？我有很多组合（一些组合可能是动态的）:(

参考link