Показать скрытый div при касании элемента списка сенча

Я создал список с приведенным ниже кодом, он отлично работает, теперь я хочу показать скрытие extraInfo Div на itemTap списка. Как я могу это сделать? Пожалуйста помогите

{
    xtype: 'list',
    scrollable: true,
    itemTpl: new Ext.XTemplate('<div class="schedule">',
                                            '<div class="scheduleInfo">',
                                                '<div class="gameDate">',
                                                    '<div class="weekDay">{weekDay}</div>',
                                                    '<div class="day">{day}</div>',
                                                '</div>',
                                                                                                '<div class="gameInfo">',
                                                        '<div class="timeLocation">',
                                                            '{time} / {location}',
                                                        '</div>', 
                                                                                                                '</div>',
                                                        '</div>',
                                            '<tpl if="hasExtraInfo === true">',
                                                '<div class="extraInfo">{extraInfo}</div>',
                                            '</tpl>',
                                        '</div>'
                        ),
    store: 'Schedule',
    itemCls: 'scheduleListItem',
    flex : 1
}

extjs sencha-touch sencha-touch-2.1 sencha-touch-2.2
person MSC    schedule 17.09.2013    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Добавьте прослушиватель itemTap в ваш список. Затем вы можете скрыть /показать ваш div используя его методы, или toggle скрытый класс CSS, например:

{
    xtype: 'list',
    // ...
    listeners: {
        itemtap: function(list, index, target) {
            var div = target.element.down('.extraInfo');
            // avoid crashing for items with no extra info
            if (div) {
                div.toggleCls('x-hidden-display');
            }
        }
    }
}
person rixo    schedule 17.09.2013
comment
@Viswa Я считаю, что пропуск фигурных скобок делает код менее читаемым и, следовательно, менее поддающимся отладке, поэтому, пожалуйста, не удаляйте мины. - person rixo; 17.09.2013