Question

我想创建链接组合，例如我们有3个组合：第二个取决于第一个选择，第三个取决于第二个选择。全部都有远程商店。

现在我使用这样的东西：

onFirstComboSelect: function( t, recs ) {
    var _rec = recs[0];
    this.getSecondCombo().enable();
    var _secondComboStore = this.getSecondCombo().getStore();
    _secondComboStore.getProxy().extraParams.firstComboValue = _rec.get('id');
    _secondComboStore.load();
},

这是select事件的监听器，它运行良好。对于第3个组合侦听器是类似的。但是，当我想用一组参数加载这组组合时，会出现一些问题。我必须为第一个框设置一个值（我使用setValue（）方法），为第二个组合商店设置extraParams，设置ajax请求，等待回答，在回调中为第三个组合设置相同的操作，等等。我不确定这是最好的方式。

示例：

    if( window.data ) {
        var _data = window.data,
            _self = this;

        if( _data.firstComboValue ) {
            // select first combo value
            this.getFirstCombo().setValue( _data.firstComboValue );

            // select second combo value
            var _secondCombo = _self.getSecondCombo(),
                _secondComboStore = _secondCombo.getStore();
            _secondCombo.enable();
            _secondComboStore.getProxy().extraParams.firstComboValue = _data.firstComboValue;
            _secondComboStore.load( {
                callback: function() {
                    if( _data.secondComboValue ) {
                        _secondCombo.setValue( _data.secondComboValue );

                        //select third combo value
                        var _thirdCombo = _self.getThirdCombo(),
                            _thirdComboStore = _thirdCombo.getStore();
                        _thirdCombo.enable();
                        _thirdComboStore.getProxy().extraParams = {
                            firstComboValue: _data.firstComboValue,
                            secondComboValue: _data.secondComboValue
                        };
                        _thirdComboStore.load( {
                            callback: function() {
                                if( _data.thirdComboValue ) {
                                    _thirdCombo.setValue( _data.thirdComboValue );
                                }
                            }
                        } );
                    }
                }
            } );
        }
    }

另外我有一个想法：我可以使用firstId / firstText / secondId创建一个商店，而不是使用3个不同的商店（在我的情况下服务器上有3个不同的.php处理程序）和相同的ID /文本模型/ secondText / thirdId / thirdText模型并将其用于所有3个组合。这样我就可以在每个select事件上实现所有组合的数据，但为此我有机会在框中轻松安装一组数据，而无需进行大量嵌套回调。你怎么看待它？

对于我的问题的拼写和描述中的任何错误，我深表歉意。如果需要，我将很乐意提供更详细的解释。

Answer 1

在您的情况下，您不需要编写三个模型或三个处理程序方法。您可以在每个组合框中定义下一个组合框ID，如下所示。


items:[
{
  xtype:'combo',
  id:'combo-1',
  nextComboId:'combo-2',
},
{
  xtype:'combo',
  id:'combo-2',
  nextComboId:'combo-3'
},
{
  xtype:'combo',
  id:'combo-3'
}]

现在你可以使用一次常用方法来处理combo-1和combp-2的select事件，你可以根据需要为多个组合做同样的事情。

onComboSelect: function( combo, recs ) {
    var nextCombo = combo.nextComboId;
    nextCombo.getStore().getProxy().extraParams.comboValue = _rec[0].get('id');
    nextCombo.getStore().load();
}

ExtJS 4 MVC创建链接组合的最佳方式

1 个答案: