1. #1
    Sencha User
    Join Date
    Oct 2012
    Posts
    29
    Answers
    2
    Vote Rating
    0
    jerrysolomon is on a distinguished road

      0  

    Default Unanswered: Dynamic dataview itemTpl/DataItem

    Unanswered: Dynamic dataview itemTpl/DataItem


    I'm sure I'm making this more complicated than it has to be...
    My data record has 2 fields: 'title' and 'link'.
    If 'link' is null, I just want 'title' in a <div>: <div>{title}</div>.
    If 'link' is not null, I want to create an anchor tag: <div><a href={link}>{title}</a></div>

    Since I see no way to do a conditional itemTpl, I'm trying DataItem:
    Code:
    Ext.define('MyListItem', {
        extend: 'Ext.dataview.component.DataItem',
        requires: ['Ext.Label'],
        xtype: 'mylistitem',
    
    
        config: {
            nameLabel: true,
    
    
            dataMap: {
                getNameLabel: {
                    setHtml: 'title'
                }
            }
        },
    
    
        applyNameLabel: function(config) {
            objLabel = Ext.factory(config,Ext.Label,this.getNameLabel());
                   //hoped to do a record.get('link') here and possibly reset html. Doesn't seem to work.
            return objLabel; 
        },
    
    
        updateNameLabel: function(newNameLabel, oldNameLabel) {
            
            if (oldNameLabel) {
                this.remove(oldNameLabel);
            }
    
    
            if (newNameLabel) {
                this.add(newNameLabel);
              //record.get('link') doesn't work here either.
            }
        }
    });
    Current code will setHtml to the 'title' field. But I can't seem to find the right place to grab the 'link' field and create the anchor tag version of the Html. I'm also assuming that a standard anchor tag will work vs. a window.location or something more sophisticated...Best practice?
    Thanks!

  2. #2
    Sencha User
    Join Date
    Apr 2013
    Posts
    34
    Answers
    2
    Vote Rating
    0
    jjaskols is on a distinguished road

      0  

    Default


    This might be what you are looking for:

    http://www.sencha.com/forum/showthre...-List-template

  3. #3
    Sencha User efortes's Avatar
    Join Date
    Jun 2010
    Posts
    34
    Answers
    5
    Vote Rating
    2
    efortes is on a distinguished road

      0  

    Default


    You can use if statements in your xtemplate

    Code:
        '<tpl for="kids">',
            '<p>{name} is a ',
            '<tpl if="age &gt;= 13">',
                '<p>teenager</p>',
            '<tpl elseif="age &gt;= 2">',
                '<p>kid</p>',
            '<tpl else>',
                '<p>baby</p>',
            '</tpl>',
        '</tpl></p>'

  4. #4
    Sencha User
    Join Date
    Oct 2012
    Posts
    29
    Answers
    2
    Vote Rating
    0
    jerrysolomon is on a distinguished road

      0  

    Default Thanks!

    Thanks!


    Works like a charm - should have found that one myself!

Thread Participants: 2

Tags for this Thread