Question

我有一个项目列表，我在列表中插入了切换按钮。现在，根据商店中active的值，我试图设置切换按钮的值。

我面临的问题是我不知道如何获取列表的记录而不点击或选择它。

这是代码..

   var itemTemplate = new Ext.XTemplate (
       '<tpl for = ".">',
            '<div>{name}</div>',
            '<div class= "subSectionToggleButton"></div>',    
        '</tpl>'
    );


    var subSectionList = {
        height: 350,
        id: 'sList',
        xtype: 'list',
        store: App.stores.subSections,
        grouped: true,
        itemTpl: itemTemplate, //Don't need to worry about this
        listeners: {
            'refresh' : function (e) {
    //insert toggle button in empty div class inside template   
                e.getEl().select('div .subSectionToggleButton').each(function(item) {
                    var toggleButton = new Ext.form.Toggle ({
                       renderTo: item,
                       listeners : {
            // After render I want to get the individual record, read whether it is active or not.. and then do setValue(value) on toggle button
                           'afterrender' : function (f) {
                               var rec = Ext.getCmp('sList').getRecord(f);
                                console.log(rec); // I get undefined here

                // I know how to get a record when you tap a list item but how do I get without using the tap.
                           }
                       }

                    });
                });
            }
        }
    };

Answer 1

最好在itemTpl中使用if条件，或者只是从函数中获取值。所以，它会是这样的：

var itemTpl = new Ext.XTemplate('<tpl for = ".">',
     '<div>{name}</div>',
     '<div class= "subSectionToggleButton">{active:this.setToggled}</div>',    
     '</tpl>',
     setToggled : function(active){
        if(active == true){             //Check the condition here
            return '<div class="active">Active</div>';
        }
        return '<div class="inactive">Inctive</div>';
     }

或者，你可以使用tpl if if this：

 var itemTpl = new Ext.XTemplate('<tpl for = ".">',
     '<div>{name}</div>',
     '<tpl if="active==true">',   // Or '<tpl if="active==\'true\'">',
         '<div class= "subSectionToggleButton">Active</div>', 
     '</tpl>',   
     '<tpl if="active==false">',
         '<div class= "subSectionToggleButton">Inactive</div>', 
     '</tpl>',
     '</tpl>');

Answer 2

针对您的指定方案，尝试将HTMLElement而不是Ext.Element传递给getRecord方法

var rec = Ext.getCmp('sList').getRecord(f.getEl().dom);

您还可以通过list.store.findRecord访问列表的记录 http://docs.sencha.com/touch/1-1/source/Store.html#Ext-data-Store-method-findRecord

Sencha Touch 1.1：如何在不点击列表的情况下获取个人列表记录？

2 个答案: