0

In reference to CD..'s comment on my original question, I am trying to create a custom layout for an Ext container in Extjs 4.2.2.

The basic idea is to have an Ext container with an autoEl of 'ul' with this layout that whose children are Ext containers with autoEls of 'li'.

The reason I am doing this instead of a template is because I need to be able to inject other Ext components of any sort into the 'li' containers.

I am able to get the markup I'm after: 

<ul>
    <li>{{Whatever Ext component(s)}}</li>
</ul>

With the following:

Ext.define('MyApp.container.ListItem', {
    extend: 'Ext.container.Container',

    alias: 'widget.li',

    autoEl: 'li'
});

Ext.define('MyApp.container.UnorderedList', {
    extend: 'Ext.container.Container',

    requires: [
        'MyApp.container.ListItem',
        'MyApp.layout.None'
    ],

    layout: 'nolayout',

    alias: 'widget.ul',

    defaultType: 'li',

    autoEl: 'ul'
});

Ext.define('MyApp.layout.None', {
    extend: 'Ext.layout.container.Container',

    alias: 'layout.none',

    reserveScrollbar: false,
    managePadding: false,

    childEls: [],

    renderTpl: [
        '{%this.renderBody(out,values)%}'
    ],

    setupRenderTpl: function (renderTpl) {
        var me = this;

        renderTpl.renderContainer = me.doRenderContainer;
        renderTpl.renderItems = me.doRenderItems;
    },

    calculate: function(ownerContext) {
        // I believe I should be doing something 
        // in here for this to work properly
    }
});

Everything within these components works out great. The issue I have is when I include this component in another layout or dock it within a panel. This component renders fine, but the rest will not and no errors will be displayed. I'm pretty sure that is because Ext doesn't throw all of it's layout errors and my component is breaking the render flow.

I do not want to set the size of this component via Ext if at all possible. I'm trying to take some layout load off of JavaScript.

Community
  • 1
  • 1
Sandwich
  • 61
  • 5
  • 1
    Can you create a sencha fiddle with the problem so we can try playing around with it? – CD.. May 07 '15 at 15:11
  • http://jsfiddle.net/markcooper/wqjwz3fa/ Should be accurate – Sandwich May 07 '15 at 15:46
  • Haven't debugged all the way but it sure is a problem in your 'NoLayout' layout. I'd suggest going through all the layout code and look more into the life-cycle and events. – Yellen May 08 '15 at 19:20
  • @Seram That is definitely the issue is and was hoping someone might have an idea of where to look a bit more specifically in terms of what exactly I may be missing while keeping Ext's interference in the layout to an absolute minimum. – Sandwich May 12 '15 at 12:34

0 Answers0