Results 1 to 3 of 3

Thread: Itemselector / multiselect not working

  1. #1

    Default Itemselector / multiselect not working

    We have used these extensions in past without any problem on ExtJS 4.0x but cant make it work with 4.2x. Here is the situation we are in

    This is our layout

    layout.png

    This is our code in beforeRender method of container

    Code:
    var msForm = Ext.widget('itemselector', {
                anchor: '100%',
                xtype: 'multiselect',
                msgTarget: 'side',
                fieldLabel: 'Multiselect',
                name: 'multiselect-new',
                id: 'multiselect-field',
                itemId: 'multiselect-field',
                allowBlank: false,
                store: 'pf_group',
                valueField: 'group_account_name',
                displayField: 'display_field',
                value: [],
                ddReorder: true
        });
    component.add(msForm);
    console.log(msForm);
    and this is our output

    layout2.png

    Error we are getting in console is
    Uncaught TypeError: Cannot read property 'ownerCt' of undefined

    and error is logged on following line of class MultiSelect.js
    afterrender.png


    and here is the basic dump of itemselector object after creation

    Code:
    j {anchor: "100%", xtype: "multiselect", msgTarget: "side", fieldLabel: "Multiselect", name: "multiselect-new"}
    
    
    • activeErrorsTpl: Array[3]
      • 0: "<tpl if="errors && errors.length">"
      • 1: "<ul class="{listCls}"><tpl for="errors"><li role="alert">{.}</li></tpl></ul>"
      • 2: "</tpl>"
      • length: 3
      • __proto__: Array[0]
    • activeUI: "default"
    • allowBlank: false
    • anchor: "100%"
    • bodyEl: A
    • childEls: Array[7]
    • componentCls: "x-field"
    • componentLayout: j
    • container: A
    • ddReorder: true
    • displayField: "display_field"
    • dragGroup: "MultiselectDD-ext-gen1115"
    • dropGroup: "MultiselectDD-ext-gen1115"
    • el: A
    • errorEl: A
    • events: Object
    • fieldLabel: "Multiselect"
    • frame: undefined
    • fromField: j
    • hasListeners: l
    • hierarchyState: Object
    • id: "multiselect-field"
    • initialConfig: Object
    • innerCt: A
    • inputEl: null
    • inputId: "multiselect-field-inputEl"
    • inputRow: A
    • itemId: "multiselect-field"
    • labelCell: A
    • labelEl: A
    • lastActiveError: ""
    • lastBox: null
    • lastValue: Array[0]
    • loader: null
    • msgTarget: "side"
    • name: "multiselect-new"
    • originalValue: Array[0]
    • ownerCt: j
    • ownerLayout: A
    • plugins: undefined
    • pluginsInitialized: true
    • protoEl: null
    • rawValue: Array[0]
    • renderData: Object
    • renderSelectors: Object
    • renderTpl: A
    • rendered: true
    • rendering: null
    • scrollFlags: Object
    • sideErrorCell: A
    • stateEvents: Array[0]
    • stateId: undefined
    • store: j
    • subTplData: Object
    • suspendCheckChange: 0
    • toField: j
    • ui: "default"
    • uiCls: Array[0]
    • value: Array[0]
    • valueField: "group_account_name"
    • xtype: "multiselect"
    • __proto__: Object

  2. #2
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    That's quite odd. Probably a stupid question, but are you sure you're adding it to the right component? Is this 4.2.1? And this worked for you in 4.0.7?

  3. #3

    Default itemselector not showing

    Hi,
    I am trying to add an itemselector in a popup. I am using the MVC for EXTJS4.
    Can you help in guiding me where I am going wrong ? Do i need to export any js for itemselector to work ?
    my code goes here. i get the error in firebug

    TypeError: k is undefined - ext-all.js (line 18, col 47926)




    Code:
    Ext.define('App.controller.MakerController', {    extend : 'Ext.app.Controller',
    
    
        models : [],
    
    
        stores : [],
    
    
        views : [ 'makertabpanel' ],
    
    
        init : function() {
            this.control({
                'makertabpanel button[name= addNewUser]' : {
                    click : this.openDialog
                }
            });
        },
        openDialog : function() {
            var dialog = Ext.create('Ext.window.Window', {
                renderTo : Ext.getBody(),
                title : 'Permission Uesr',
                itemId : 'adduserpopup',
                id : 'adduserpopup',
                modal : true,
                width : 1000,
                height : 400,
                layout : 'anchor',
                resizable : false,
                items : [
                         {     xtype: 'itemselector',
                             id:'itemselector1',
                             name:'userRoles',
                             anchor:'100%',
                             store: 'ProductStore',
                             toStore: 'RoleStore',
                             valueField    :'key',
                             displayField:'value',
                             value: 'ProductStore' ,
                             msgTarget: 'side',
                             fromTitle : 'Available',
                             toTitle : 'Selected'
                          }
                        ],
    
    
                buttons : [ {
                    text : 'OK',
                    id : 'okbutton',
                    action : 'addfile'
                }, {
                    text : 'Cancel',
                    id : 'cancelbutton'
                } ]
            });
            dialog.show();
        }
    });

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •