1. #1
    Touch Premium Member
    Join Date
    Nov 2011
    Posts
    10
    Vote Rating
    0
    dhanashree is on a distinguished road

      0  

    Default UX component in Architect

    UX component in Architect


    Here is what I am doing:

    I am trying to use a UX Multiselect inside my architect MVC project.
    1) I set the loader path like so
    Ext.Loader.setConfig({
    enabled: true,
    paths: {
    EXT: '.',
    'Ext.ux': 'resources/lib/ux'
    }
    });
    2) Created a container
    Ext.define('APP.view.MultiSelectListBox', {
    extend: 'Ext.container.Container',
    alias: 'widget.multiselectlistbox',

    requires: [
    'APP.view.override.MultiSelectListBox'
    ],

    height: 50,
    layout: {
    type: 'fit'
    },

    initComponent: function() {
    var me = this;

    me.callParent(arguments);
    }

    });
    3) Created the override (this is where, I think I am missing something or doing something wrong)

    Ext.define('APP.view.override.MultiSelectListBox', {
    override: 'APP.view.MultiSelectListBox',

    initComponent: function() {
    var me = this;

    console.log(me);
    Ext.apply(me, {
    items: [{xtype: 'multiselect'}]
    });

    this.callParent(arguments);
    }

    });
    4) Created a field in one of my forms by doing this. I tried setting the store config to one of my app stores, that didn't work. So tried with data object instead, that doesn't work either.
    {
    xtype: 'multiselectlistbox',
    flex: 1,
    displayField: 'DMGD_DESC',
    valueField: 'DMGD_CD',
    store: 'VisibleDamage'
    }

    I get the following error in the initComponent of the Multiselect.js
    TypeError: me.store is null
    [IMG]chrome://firebug/content/blank.gif[/IMG] if (me.store.autoCreated) {


    Can somebody help? I have to search all over regarding using UX components in architect, but so far none has helped.
    And yes, I am relatively new to Sencha, and more so with Architect.

  2. #2
    Sencha Premium Member
    Join Date
    May 2010
    Location
    Guatemala, Central America
    Posts
    1,323
    Vote Rating
    185
    ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold ssamayoa is a splendid one to behold

      0  

    Default


    Your problem is that UX component expects in store an instance of store, not the storeId.

    Other custom components of ExtJS handles both: If storeId is provided they look for it in store manager.

    Find where is used the store in the UX's component code and do the same as other ExtJS components: If store is an string look for the actual store in store manager, for example:

    Code:
        getStore: function() {
            var me = this;
            if (!me.store) {
                me.store = Ext.data.StoreManager.lookup(me.storeId);
            }
            return me.store;
        },
    UI: Sencha Architect 3.x / ExtJS 4 & 5
    Server side: JEE / EJB 3.x / CDI / JPA 2.x/ JAX-RS / JasperReports
    Application Server: Glassfish / WildFly
    Databases: Oracle / DB2 / MySQL / Firebird

    If you like my answer please vote!

Thread Participants: 1