3

複数のtrueを持つExtJsコンボボックスがあり、「値1、値2、値3」の代わりに「X値が選択されました」を入力フィールドに表示したいと思います。selectリスナーで試しましたが、値を入力フィールドに設定してからmulticombo.getValue()を呼び出すと、入力フィールドから値が取得されます。valueField(非表示の入力)から値を取得するようなものが必要になります。

私のコード:

var multiCombo = Ext.create('Ext.form.field.ComboBox', {
    renderTo: item.id,
    multiSelect: true,
    displayField: 'name',
    editable: false,
    valueField: 'id',
    emptyText: 'Select',
    hiddenName: 'data[Model][' + item.getAttribute('question-id') + '][value]',
    submitValue: true,
    inputType: 'hidden',
    value: selectedOptions,
    width: 300,
    store: store,
    queryMode: 'local',
    listeners: {
        expand: function (combo) {
            var values = Ext.get(combo.hiddenDataEl.dom.lastChild).dom.value;
            values = values.split(",");
            Ext.each(values, function (value, i) {
                values[i] = parseInt(value);
            });
            combo.setValue(values);
            Ext.get(combo.getInputId()).dom.value = values.length + ' selected';
        },
        select: function (combo, values) {
            if (values[values.length - 1].data.id === parseInt(item.getAttribute('not-applicable'))) {
                combo.setValue(parseInt(item.getAttribute('not-applicable')));
            } else {
                var notApplicable = -1;
                var newValues = combo.getValue();
                if ((notApplicable = combo.getValue().indexOf(parseInt(item.getAttribute('not-applicable')))) != -1) {
                    newValues.splice(notApplicable, 1);
                }
                combo.setValue(newValues);
            }
            Ext.get(combo.hiddenDataEl.dom.lastChild).dom.value = combo.getValue().join(',');
            optionsSelected = combo.getValue();
            Ext.get(combo.getInputId()).dom.value = optionsSelected.length + ' selected';
        },
        change: function (combo) {
            if (item.getAttribute('required') == 'true') {
                if (combo.getValue().length == 0) {
                    question.findParentNode('li', 1, true).addCls("is_required");
                } else {
                    question.findParentNode('li', 1, true).removeCls("is_required");
                }
                //There is no ExtJs equivalent for this
                $('#' + combo.getInputId()).keyup();
            }
        }

    }
});
4

2 に答える 2

3

すべてのイベントハンドラーで何が起こっているかはわかりませんが(何かが足りない可能性があります)、上記の最初の文で説明したことを実現する最も簡単な方法は、コンボの独自の実装を提供することです。getDisplayValue方法。ここにそれはドキュメントにあります。

選択された値の数を返すように設定するだけです。次に例を示します。

var multiCombo = Ext.create('Ext.form.field.ComboBox', {
    renderTo: item.id,
    multiSelect: true,
    displayField: 'name',

    // your own getDisplayValue implementation
    getDisplayValue: function() {
        return multiCombo.value.length + ' values selected';
    },

    editable: false,
    valueField: 'id',
    emptyText: 'Select',
    hiddenName: 'data[Model][' + item.getAttribute('question-id') + '][value]',
    submitValue: true,
    inputType: 'hidden',
    value: selectedOptions,
    width: 300,
    store: store,
    queryMode: 'local',
});
于 2012-07-25T16:38:47.387 に答える
2

また、これは役立つかもしれません:

getDisplayValue: function() {
            return (this.displayTplData.length > 1) ? this.displayTplData.length + ' selected' : this.displayTplData[0].name;
        },
于 2014-05-21T09:48:40.883 に答える