2011-02-18 5 views
0

나는 중첩 된 목록이 있습니다. 마지막 항목을 가져올 때 패널을 회전 목마와 바꾸는 핸들러를 호출하고 싶습니다. 참조하십시오 - http://test.miaduk.com/mobile/TLE/nestedList에서 회전식 슬라이드 쇼를 보여줍니다 - 아마도 처리기를 사용하고 있습니까?

불행히도 중첩 된 항목에 대한 작업을 처리 할 수 ​​없어 다른 방법으로 생각할 수 없습니다. 나는 여전히 Sencha의 초심자이기 때문에 어떤 도움을 주시면 감사하겠습니다. 감사합니다.

참조 코드 :

Ext.setup({ 
icon: 'icon.png', 
tabletStartupScreen: 'tablet_startup.png', 
phoneStartupScreen: 'phone_startup.png', 
glossOnIcon: true, 
onReady: function() { 


    /*Data Store 
    *********************************************************************************/ 
var data = { 
    text: 'Categories', 
    items: [{ 
     text: 'Core Skills/Personal Development', 
     items: [{ 
      text: 'Fishbone Diagram', 
      leaf: true 
     },{ 
      text: '5 Whys Technique', 
      leaf: true 
     },{ 
      text: 'SMART Objectives', 
      leaf: true 
     },{ 
      text: 'Circle of Influence', 
      leaf: true 
     },{ 
      text: 'Managing Stress', 
      leaf: true 
     }] 
    },{ 
     text: 'Communication', 
     items: [{ 
      text: 'Listening Skills', 
      leaf: true 
     },{ 
      text: 'Giving Feedback', 
      leaf: true 
     },{ 
      text: 'Recieving Feedback', 
      leaf: true 
     }] 
    },{ 
     text: 'Customer Service', 
     items: [{ 
      text: 'Listening and Confirming', 
      leaf: true 
     }] 
    }] 
}; 
Ext.regModel('ListItem', { 
    fields: [{name: 'text', type: 'string'}] 
}); 
var store = new Ext.data.TreeStore({ 
    model: 'ListItem', 
    root: data, 
    proxy: { 
     type: 'ajax', 
     reader: { 
      type: 'tree', 
      root: 'items' 
     } 
    } 
}); 
var nestedList = new Ext.NestedList({ 
    fullscreen: true, 
    title: 'Categories', 
    displayField: 'text', 
    dock: 'top', 
    store: store 
}); 


    /*Carousel 
    *********************************************************************************/ 
    var carousel = new Ext.Carousel({ 
    fullscreen: true, 
    displayField: 'text', 
    dock: 'top', 
     defaults: { 
      cls: 'card' 
     }, 
     items: [{ 
      html: '<img src="drainImage1.png">' 
     }, 
     { 
      title: 'Tab 2', 
      html: '<img src="drainImage2.png">' 
     }] 
    }); 


    /*Tab Panel 
    *********************************************************************************/ 

    var tabpanel = new Ext.TabPanel({ 
     tabBar: { 
      dock: 'bottom', 
      layout: { 
       pack: 'center' 
      } 
     }, 
     fullscreen: true, 
     ui: 'light', 
     cardSwitchAnimation: { 
      type: 'slide', 
      cover: true 
     }, 

     defaults: { 
      scroll: 'vertical' 
     }, 
     items: [{ 
      title: 'My Courses', 
      html: '<h1>Course list to appear here</h1>', 
      iconCls: 'favorites', 
      cls: 'card2', 
      badgeText: '3', 
      dockedItems: nestedList 
     },{ 
      title: 'Sample', 
      cls: 'card2', 
      iconCls: 'user', 
      dockedItems: carousel 
     },{ 
      title: 'Help', 
      html: '<h1>Help</h1><p>Info on how to add to your home screen goes here</p>', 
      cls: 'card3', 
      iconCls: 'user' 
     }] 
    }); 

답변

1

확인 센차 NestedList에서이 샘플

http://dev.sencha.com/deploy/touch/examples/nestedlist/index.js

당신이 콜백을 실행하기 위해 중첩 된 목록에 연결할 수는 "leafitemtap"이벤트가있다 :

nestedList.on('leafitemtap', function(subList, subIdx, el, e, detailCard) { 
     var ds = subList.getStore(), 
      r = ds.getAt(subIdx); 

     Ext.Ajax.request({ 
      url: '../../src/' + r.get('id'), 
      success: function(response) { 
       detailCard.setValue(response.responseText); 
      }, 
      failure: function() { 
       detailCard.setValue("Loading failed."); 
      } 
     }); 
    }); 
관련 문제