1. #1
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,499
    Vote Rating
    283
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      2  

    Default CTemplate - Components in Templates

    CTemplate - Components in Templates


    http://skirtlesden.com/ux/ctemplate

    I've written an extension to Ext.XTemplate that allows full-blown ExtJS 4 components to be injected as template values. It was originally just part of my Component Column class but it seemed worth the effort to promote it to a UX in its own right.

    When the template is run it injects placeholder HTML rather than the component. Once that placeholder HTML makes it to the DOM the component is switched back in. Sometimes this technique causes sizing or scrollbar issues. It should be used only where it is suitable, it isn't a panacea.

    Most use cases for a CTemplate involve wanting to inject a component where the only means provided for simple customization is a template or possibly even raw HTML. As such they are a way of subverting the design decisions taken by other developers and should be used with appropriate caution.

    An example:

    Code:
    var template = Ext.create('Skirtle.CTemplate', 
        '<div>', 
            '{label} {button}', 
        '</div>' 
    ); 
     
    template.overwrite(Ext.fly(...), { 
        label: 'Thomas', 
        button: Ext.create('Ext.button.Button', { 
            text: 'Edit' 
        }) 
    });
    No attempt is made to manage the size or destruction of the components.

    There are several similar UXs already in circulation. To list a few:

  2. #2
    Sencha User mberrie's Avatar
    Join Date
    Feb 2011
    Location
    Bangkok, Thailand
    Posts
    506
    Vote Rating
    14
    mberrie will become famous soon enough mberrie will become famous soon enough

      0  

    Default


    Nice! Good to know that now there is an Ext4-ready solution for this kind of technique!

  3. #3
    Sencha Premium Member ajaxvador's Avatar
    Join Date
    Nov 2007
    Location
    PARIS, FRANCE
    Posts
    206
    Vote Rating
    0
    ajaxvador is on a distinguished road

      0  

    Default


    +1
    Vador

  4. #4
    Sencha User
    Join Date
    Nov 2011
    Posts
    5
    Vote Rating
    0
    Lilliana is on a distinguished road

      0  

    Default


    This extension is just what I need. This will surely save me lots of time on my current project that I have in development. I have been looking for a template extension like this one to help make my work process more efficient. It seems like I waste a great deal of my time with tedious tasks such as setting up new pages and tables and such. I really love the idea of only having to set everything up once. Thanks a lot.

  5. #5
    Sencha User
    Join Date
    Dec 2008
    Location
    Manchester, UK
    Posts
    103
    Vote Rating
    8
    LisburnLad will become famous soon enough

      0  

    Default


    Hi Skirtle,
    I was wondering if you'd had a chance to try out your CTemplate with the new 4.1 Beta release? I had been using your CTemplate in version 4.0.7 and it was all working very nicely. I've just upgraded to 4.1 and now everything has stopped working at the point where I try to append the template.

    I know that XTemplates and overrides were 2 of the areas changed in version 4.1.

    Thanks for any feedback.
    Steve

  6. #6
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,499
    Vote Rating
    283
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    I think I have it working with 4.1.0-beta-1 but I'm not going to release it until 4.1.0 is released. I'll send you a preview by PM.

  7. #7
    Sencha User Jad's Avatar
    Join Date
    Feb 2012
    Location
    annecy france
    Posts
    61
    Vote Rating
    1
    Jad is on a distinguished road

      0  

    Default how to use it

    how to use it


    Hello,
    Can I have o complete example to use this plugin

    Thanks a lot

  8. #8
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,499
    Vote Rating
    283
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    There are two complete examples if you just follow the link to the download page.

  9. #9
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,499
    Vote Rating
    283
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Apologies for not yet releasing a version that's compatible with 4.1, I'll do it as soon as I find time.

    If anyone needs a quick patch for the stack overflow then you just need to swap around the dependency between apply and applyTemplate. Should be a 2-line change, renaming the method on line 26 and switching round the alias at the end.

  10. #10
    Sencha User Jad's Avatar
    Join Date
    Feb 2012
    Location
    annecy france
    Posts
    61
    Vote Rating
    1
    Jad is on a distinguished road

      0  

    Default


    Very great plugin ;-)