自动加载面板监听器 ExtJs

Question

我在 extjs 中有一个带有监听器代码的视图文件，这里是：

initComponent: function() {
            Ext.apply(this, {
                title               : 'Form Order',
                iconCls             : 'orderIcon',
                width               : 850,
                maxHeight           : 600,
                x                   : 200,
                y                   : 50,
                resizable           : true,
                resizeHandles       : 's n',
                constrainHeader     : true,
                closable            : true,
                modal               : true,
                autoShow            : false,
                autoScroll          : true,
                overflow            : 'auto',
                layout: {
                    type: 'auto',
                    align: 'stretch'
                },
                items: [
                    this.createPanelMC()
                ]
            });
            this.callParent(arguments);
        },
        createPanelMC: function() {
            this.requiredSign = '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>';
            var panel = Ext.create('Ext.form.Panel', {
                defaultType: 'textfield',
                name: 'nodebPanel',
                width: '100%',
                layout: {
                    type: 'auto',
                    align: 'stretch'
                },
                items: [{
                    xtype   : 'fieldset', 
                    name    : 'modlayanan',
                    title   : 'Data Pelanggan',
                    layout  : 'column',
                    width   : '95%',
                    margin  : '10',
                    items: [{
                        xtype           : 'textfield',
                        name            : 'nomor',
                        id              : 'nomor',
                        itemId          : 'nomor',
                        fieldLabel      : 'PSTN',
                        emptyText       : 'Nomor...',
                        margin          : '10 0 0 0',
                        width           : 350,
                        labelWidth      : 100,
                        afterLabelTextTpl: this.requiredSign    
                    }, {
                        xtype           : 'textfield',
                        fieldLabel      : 'Speedy',
                        name            : 'speedy',
                        id              : 'speedyVal',
                        itemId          : 'speedyVal',
                        margin          : '10 0 10 20',
                        width           : 350,
                        labelWidth      : 100
                    }, { 
                        xtype        : 'textareafield',
                        name         : 'instaLAddress',
                        fieldLabel   : 'Alamat Instalasi',
                        emptyText    : 'Alamat Instalasi...',
                        readOnly     : true,
                        labelWidth   : 100,
                        autofocus: true,
//listener
                        listeners   : {
                            render: function() {
                                this.getEl().on('mousedown', function(e, t, eOpts) {
                                var nopstn = Ext.getCmp('nomor').getValue();
                                var speedy = Ext.getCmp('speedyVal').getValue();

                                    if (nopstn != '' && speedy != '') {
                                        var store = Ext.ComponentQuery.query('#treeProduct')[0].getStore();
                                        console.log(store);
                                        store.load({
                                            params: {
                                                nopstn: nopstn,
                                                speedy: speedy
                                            }
                                        });
                                    }
                                });
                            }
                        }
                    }, 
                    this.createTreePaketExist(),
                    ]
                }]
            });
            return panel;
        },
createTreePaketExist: function() {
            var storeTree = Ext.create('Ext.data.TreeStore', {
                proxy: {
                    type: 'ajax',
                    url: 'data/newoss_get_paket.php',
                    actionMethods :{
                        create: 'POST', read: 'POST', update: 'POST', destroy: 'POST'
                    }
                }
            });

            var groupProduct = Ext.create('Ext.tree.Panel', {
                store       : storeTree,
                itemId      : 'treeProduct',
                renderTo    : Ext.getBody(),
                name        : 'treeProduct',
                rootVisible : false,
                useArrows   : true,
                layout      :'fit',
                margin      : '0 0 0 0',
                autoScroll  : true,
                height      : 150,
                width       : '93%',
                listeners: 
                {
                    checkchange: function(node, checked, eOpts){
                         node.eachChild(function(n) {
                        node.cascadeBy(function(n){
                            n.set('checked', checked);
                        });
                    });
                    p = node.parentNode;
                    var pChildCheckedCount = 0;
                    p.suspendEvents();
                    p.eachChild(function(c) { 
                        if (c.get('checked')) pChildCheckedCount++; 
                            p.set('checked', !!pChildCheckedCount);
                        });
                    p.resumeEvents();
                    }
                }
            });
            return groupProduct; 
        }

监听器将在createTreePaketExist() 中显示树形面板。问题是..我想在不点击任何东西的情况下显示树面板结果，只在面板加载时显示结果。
在我的代码中，结果将在我将指针放入 textareafield 后显示。它怎么能在没有任何点击的情况下显示，只在面板加载时显示？有人可以帮助我吗？谢谢..

Answer 1

我想你之前的Question已经回答了这个问题。

您在这里遇到的问题是您的商店依赖于用户键入的值，因此您的商店在用户完成某些操作之前无法加载。

所以你不能在没有值的情况下自动加载商店，除非你提供默认值来加载商店，然后如果用户输入新信息，它可以用不同的数据重新加载。

如果不知道商店正在处理哪些数据、如何根据用户数据过滤数据、他们可以输入什么数据或您希望他们输入什么数据，就很难对此提供深入的回答。