Results 1 to 2 of 2

Thread: Reusable XTemplate Manager Design Pattern

  1. #1
    Touch Premium Member
    Join Date
    Sep 2011
    Vote Rating

    Lightbulb Reusable XTemplate Manager Design Pattern

    I'm working on a Sencha Touch app with 200 screens. Many of the screens share common UI elements, so in a fit of refactoring I created an XTemplate Manager to store XTemplate code.

    XTemplateManager = {
        getTpl: function(name) {
            return new Ext.XTemplate(this.tpl[name]);
        tpl: {
            'myTpl': '<div class="contacts">{firstName}</div>
    This was great where the XTemplate was heavily reused. However, it has started to become a giant file that is hard to navigate. Also it's another layer of indirection when I separate out the XTemplate from it's view.

    Is this a good design pattern? Is there another solution to externalize XTemplates for reuse? Just curious how others do it. Thanks.

    (I've only worked with Sencha Touch but I think this should apply to Ext as well.)

  2. #2
    Sencha User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Gainesville, FL
    Vote Rating


    I have done just this as part of my locale so it's not a bad thing. MVC is great but you can still have utility classes like this.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:

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