PDA

View Full Version : selectionchange Event not working with dataview



mk.ranjan
22 Aug 2012, 12:14 AM
Trying to get the event on selectionchange. But it is not actually getting into event..
Implemented with by taking help from example code only.

Plz look into it.. below is the code


var dv = new Ext.DataView({ autoScroll: true,
tpl: new Ext.XTemplate(
'<tpl for=".">',
'<div class="thumb ab">',
'<div class="content">',
'<div class="text-wrap" style="background:#FFFFFF">',
'<div class="text">',
'<div class="title">{data.title}</div>',
'<div class="desc">{data.description}</div>',
'</div>',
'</div>',
'</div>',
'</div>',
'</tpl>',

),
store: mystore,
autoHeight: false, multiSelect: true,
overClass: 'x-view-over', itemSelector: 'div.thumb',
emptyText: 'No images to display',
style: 'margin-top: 10px;',
listeners: {
selectionchange: function(dv, nodes) {
console.log("clicked");
}
}
});

vietits
22 Aug 2012, 12:52 AM
The following code works well with Ext 4.1.1, Chrome 21:


Ext.onReady(function(){
var mystore = Ext.create('Ext.data.Store', {
fields: ['title', 'description'],
data: [{
title: 'title1', description: 'description1'
},{
title: 'title2', description: 'description2'
}],
proxy: 'memory'
});


var dv = Ext.create('Ext.DataView', {
renderTo: Ext.getBody(),
width: 400,
height: 400,
autoScroll: true,
tpl: new Ext.XTemplate(
'<tpl for=".">',
'<div class="thumb ab">',
'<div class="content">',
'<div class="text-wrap" style="background:#FFFFFF">',
'<div class="text">',
'<div class="title">{title}</div>',
'<div class="desc">{description}</div>',
'</div>',
'</div>',
'</div>',
'</div>',
'</tpl>'
),
store: mystore,
autoHeight: false,
multiSelect: true,
overItemCls: 'x-view-over',
itemSelector: 'div.thumb',
emptyText: 'No images to display',
style: 'margin-top: 10px;',
listeners: {
selectionchange: function(dv, nodes) {
console.log("clicked", nodes);
}
}
});
});