PDA

View Full Version : DataView selector tap



arandlett
21 Jul 2011, 11:46 AM
In MVC, how do I capture a DataViews selector tap like I would a list. So I load a view which has a dataview and I have a grid of images generated from DataView. I need to detect tap in the controller to pass along data to next view.

I have can set event delegation to the parent dom element however I only get object of the element clicked not the data the DataView would associate with each object.

ziaullhaq.s
12 Apr 2012, 1:01 AM
Here I am extending the Dataview to use it frequently in my code.

Ext.define('WitMSite.view.ContView', {
extend : 'Ext.dataview.DataView'
,xtype : 'contview'
,requires : [
'Ext.dataview.DataView'
]
,config : {
scrollable : false
,store: {
fields : ['img']
,data : [
{ img : 'resources/images/phone/head/icons/about.png' }
,{ img : 'resources/images/phone/head/icons/contact.png' }
]
}
,itemTpl: new Ext.XTemplate(
'<tpl for=".">',
'<img src="{img}" />',
'</tpl>'
)
}
});

This extended DataView is used in our code as follows
{
xtype : 'contview'
,height : 60
,id : 'dataViewId'
}

Use of Id of component to capture the events of it using the Controller.

Ext.define('WitMSite.controller.phone.Main',{
extend : 'Ext.app.Controller'
,config : {
refs : {
dataViewAccessedUsingId : '#dataViewId'
}
,control : {
dataViewAccessedUsingId : {
itemtap : 'dataViewItemTapped'
}
}
}
,dataViewItemTapped :function(record, index){
alert(index);
}
});

Use of xtype of component to capture the events of it using the Controller.

Ext.define('WitMSite.controller.phone.Main',{
extend : 'Ext.app.Controller'
,config : {
control : {
'contview' : {
itemtap : 'dataViewItemTapped'
}
}
}
,dataViewItemTapped :function(record, index){
alert(index);
}
});