如何从多选器组件中读取值

Question

我正在尝试使用 EXTJS 6.5.2 中的多选器

这是我用来创建具有我需要的值的多重选择器的代码

{
    xtype: 'multiselector',
    title: 'I caktohet:',

    name: 'Caktohen[]',
    bind: '{userfullname.value}',

    fieldName: 'userfullname',

    viewConfig: {
        deferEmptyText: false,
        emptyText: 'Askush i zgjedhur'
    },

    search: {
        field: 'userfullname',
        model: 'InTenders.model.UserModel',
        store: {
            type: 'users',
            sorters: 'userfullname',
            // proxy: {
            //     type: 'rest',
            //     limitParam: null,
            //     url: 'api/User'
            // }
        }
    }
}

当我调用 form = win.down('form') 记录时，我可以获得除 multiselector 值之外的所有值，它们在控制台上显示为 this。

任何人都可以帮助我或指导我如何获取这些值？

谢谢。

//我试图获取多选器项目并保存它们的代码

saveTenderForm: function (button, e, eOpts) {
        var userMultiSelector = Ext.getCmp('AssignedUsers'); //save assigned users
        var selectedUsers = userMultiSelector.getStore().getData(); //get store and put them in array


        var me = this,
            win = button.up('window'),
            form = win.down('form'),
            // formApplyUpload = this.getFormApplyUpload(),
            // var ko = win.items.items[0].items.items[0].value; 
            recordtenderUsers = Ext.create('InTenders.model.TenderSaveModel');
            // recordtenderUsers = form.getRecord();
            // record = form.getRecord(),
            values = form.getValues();
            // appFile = this.getApplicationFile(),
            // callbacks;
            recordtenderUsers.set(values);
            recordtenderUsers.set('tenderUsers',selectedUsers.items);


        // // me.showMask();
        // if (form.isValid()) {

            recordtenderUsers.save({
                success: function (recordtenderUsers, operation) {
                    win.close();
                    me.hideMask();
                },
                failure: function (recordtenderUsers, operation) {
                    me.hideMask();
                }
            });

Answer 1

您可以使用 multiselector.down('grid') this will return you the grid. And grid have method getSelection() 获得价值。

在此FIDDLE中，我创建了一个演示。我希望这会 help/guide 你达到你的要求。

代码片段

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create({
            xtype: 'form',
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'multiselector',
                title: 'Multi selector example',
                fieldName: 'text',
                viewConfig: {
                    deferEmptyText: false,
                    emptyText: 'No value selected'
                },

                search: {
                    field: 'text',
                    store: {
                        fields: [{
                            name: 'text',
                            type: 'string'
                        }],
                        data: [{
                            text: 'ABC'
                        }, {
                            text: 'ABC 1'
                        }, {
                            text: 'ABC 2 '
                        }, {
                            text: 'ABC 3'
                        }, {
                            text: 'ABC 4'
                        }]
                    }
                }
            }, {
                xtype: 'button',
                text: 'Get Value',
                margin:15,
                handler: function (btn) {
                    var multiselector = btn.up('form').down('multiselector');
                    if (multiselector.down('grid')) {
                        multiselector.down('grid').getSelection().forEach(rec => {
                            console.log(rec.get('text'));
                        });
                    }
                }
            }]
        });
    }
});

如何从多选器组件中读取值

How to read values from multiselector component

javascript

extjs

extjs6.5