Results 1 to 2 of 2

Thread: Convert List to Nested List with <tpl>

  1. #1
    Sencha User
    Join Date
    Oct 2012
    Posts
    1
    Vote Rating
    0
      0  

    Default Convert List to Nested List with <tpl>

    I would like to convert my list configured with below code to Nested List

    Ext.define('Mobile.view.ActionListView', {
    extend: 'Ext.dataview.List',
    xtype: 'actionsummary',
    id: 'actionsummaryList',


    config: {
    title: 'Actions',

    store: 'ActionSummaryStore',
    //data:[{"Id":1,"TransactionType":"Transaction 1","ActionList":[{"Id":1,"Count":4,"Action":"Action Item 1","CurrentStatus":"Open"},{"Id":2,"Count":14,"Action":"Action Item 3","CurrentStatus":"Open"},{"Id":3,"Count":44,"Action":"Action Item 5","CurrentStatus":"Close"}]}],
    emptyText: 'Loading action items...',
    itemTpl: Ext.create('Ext.XTemplate', '<tpl for=".">',
    '<div class="action-item-container"><p class="action-text">{TransactionType}</p>',
    '<tpl for="ActionList"><tpl for=".">',
    '<div><ul>',
    '<li><a href="javascript:void(0)"><span class="action-count">{CurrentStatus}<tt>({Count})</tt></span><span class="btn-{Action}">{Action}</span></a></li>',

    '</ul></div>',
    '</tpl></tpl>',
    '</div>',
    '</tpl>'


    )
    }
    });

    Can any one help me out? I posted the same question with the code i tried in Stackoverflow

    This is what i am trying


    Ext.define('Mobile.view.ActionListView', { extend: 'Ext.dataview.NestedList', xtype: 'actionsummary', id: 'actionsummaryList', config: { title: 'Actions', store: 'ActionSummaryStore', useTitleAsBackText: false, onItemDisclosure: true, //data:[{"Id":1,"TransactionType":"Transaction 1","ActionList":[{"Id":1,"Count":4,"Action":"Action Item 1","CurrentStatus":"Open"},{"Id":2,"Count":14,"Action":"Action Item 3","CurrentStatus":"Open"},{"Id":3,"Count":44,"Action":"Action Item 5","CurrentStatus":"Close"}]}], itemTpl: Ext.create('Ext.XTemplate', '<tpl for=".">', '<div class="action-item-container"><p class="action-text">{TransactionType}</p>', '<tpl for="ActionList"><tpl for=".">', '<div><ul>', '<li><a href="javascript:void(0)"><span class="action-count">{CurrentStatus}<tt>({Count})</tt></span><span class="btn-{Action}">{Action}</span></a></li>', '</ul></div>', '</tpl></tpl>', '</div>', '</tpl>' ) }, getTitleTextTpl: function () { return 'Summary View'; }, getItemTextTpl: function (node) { // return '<div><strong>{name}:</strong> <em>{description}</em></div>'; //replace this code with my above itemTPL } });

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,551
    Answers
    3931
    Vote Rating
    1271
      0  

    Default

    So you want to show an array within a list item?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

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
  •