如何在Sencha Touch中添加表格單元格的點按事件？

我有一個dataView，我將數據綁定到一個表。這是一個複雜的數據，我必須爲每個表格單元綁定點擊事件。我不知道Sencha Touch如何做到這一點，但jQuery和jQMobile也完成了同樣的工作。如何在Sencha Touch中添加表格單元格的點按事件？

這是我的代碼。

var touchTeam = Ext.create('Ext.DataView', { 
     fullscreen: true, 
     items:[{ 
      xtype:'toolbar', 
      title:'Dashboard', 
      docked:'top', 
      items:[{ 
       iconCls:'home', 
       iconMask:true, 
       ui:'confirm' 
      },{ 
       xtype:'spacer' 
      },{ 
       xtype:'button', 
       text:'Logout', 
       ui:'decline', 
       handler:function(){ 
        Ext.Msg.confirm('ALERT','Are you sure that you want to logout?',Ext.emptyFn); 
       } 
      }] 
     },{ 
      xtype:'toolbar', 
      docked:'bottom' 
     }], 
     store: { 
      fields: ['AAAA', 'BBBB', 'CCCC', 'DDDD', 'EEEE'], 
      data: [ 
       {AAAA: 'TableRow1', BBBB: 0,CCCC:4,DDDD:2,EEEE:0}, 
       {AAAA: 'TableRow2', BBBB: 0,CCCC:0,DDDD:0,EEEE:0}, 
       {AAAA: 'TableRow3', BBBB: 0,CCCC:0,DDDD:0,EEEE:0}, 
       {AAAA: 'TableRow4', BBBB: 0,CCCC:0,DDDD:0,EEEE:0}, 
      ] 
     }, 
     itemTpl:'<table border="0" cellpadding="5" cellspacing="5" style="width:100%; margin-top:10px;"><tr><td style="width:20%; text-align: center;">{AAAA}</td><td style="width:20%; text-align: center;">{BBBB}</td><td style="width:20%; text-align: center;">{CCCC}</td><td style="width:20%; text-align: center;">{DDDD}</td><td style="width:20%; text-align: center;">{EEEE}</td></tr></table>' 
    });

來源

2012-03-01 Dipin Krishnan

您需要在數據視圖中附加「itemtap」偵聽器。在函數內部，你必須檢查目標元素。

listeners : { 
    scope : this, 
    itemtap : function(dataview, index, el, record, e){ 
     //Browser event e 
     console.log(e.target, el); 
    } 
}

來源

2012-03-01 15:09:30 Swar

是它的工作做在<td>。但是我有什麼選擇來選擇tapped元素的屬性嗎？例如。我與rowid，所以如何選擇ID？ jQuery：'$（「td＃cellID」）。attr（rowid）'。 – 2012-03-02 04:02:38

您可以檢查e.target元素和Ext.get（e.target）.getAttribute（'id'）;會給你組件的ID。在Sencha API文檔中檢查Element類。 – Swar 2012-03-02 06:16:18

感謝您的回答。 Sencha Touch 2有沒有網格？在網格上使用時可以得到相同的結果嗎？ – 2012-03-02 07:19:15

如果您正在使用的JavaScript，你可以通過添加此

'<td class="width" style="color:black;" onClick="javascript:nameTaps">{Name}</td>',

來源

2012-03-02 05:40:05 Nag

但單擊單元格時，我需要顯示與單擊單元格對應的另一組數據。如果我使用你的方法，我怎麼做到這一點？ – 2012-03-02 07:49:40

因爲你需要傳遞參數像onClick =「javascript：NameTap（\'{Name} \'，{ID}）」 – Nag 2012-03-02 08:25:41

感謝Nag會肯定地嘗試。 – 2012-03-02 10:08:51

如何在Sencha Touch中添加表格單元格的點按事件？

回答

相關問題