PDA

View Full Version : DataView filters



ctp
4 May 2010, 5:25 AM
Hi folks,

I try to filter a store/dataview by a tag which each item in the store contains and render this item within a tab which id equals to the item's tag. I think the code should express what I'm looking for ;-)



var thumbTemplate = new Ext.XTemplate(
'<tpl for=".">',
'<div class="thumb-wrap" id="{name}">',
'<div class="thumb"><img src="images/{[values.name.replace(/ /g, "-")]}-1.jpg" class="thumb-img"></div>',
'</div>',
'</tpl>',
);
thumbTemplate.compile();

var allStore = new Ext.data.ArrayStore({
proxy: new Ext.data.MemoryProxy(),
fields: ['name', 'livingArea', 'stories', 'externalDimensions', 'houseType', 'price'],
sortInfo: {
field: 'name',
direction: 'ASC'
},
});

allStore.loadData([
['Bungalow S', '88', '1', '13 x 7,7', 'bungalow', '129.000'],
['Family L', '126', '2', '7,9 x 9,1', 'classic', '199.000']
]);

var allView = new Ext.DataView({
store: allStore,
tpl: thumbTemplate,
id: 'all',
autoHeight:true,
itemSelector: 'house',
overClass: 'house-hover',
singleSelect: true,
autoScroll: true,
});

Ext.ux.HouseType = new Ext.extend(Ext.TabPanel, {
border: true,
initComponent: function() {
var config = {
id: 'housetype',
title: 'House type',
width: 375,
activeTab: 0,
enableTabScroll: true,
defaults: {
autoScroll: true
},
items: [
{
title: 'All',
id: 'all',
items: <== should list all items from allStore
},{
title: 'Bungalows',
id: 'bungalow',
items: <== should list all items with houseType = 'bungalow'
},{
title: 'Classic',
id: 'classic',
items: <== should list all items with houseType = 'classic'
}
] // eo items
}; // eo config
Ext.apply(this, Ext.apply(this.initialConfig, config));
Ext.ux.HouseType.superclass.initComponent.apply(this, arguments);
}, // eo initComponent
onRender: function() {
Ext.ux.HouseType.superclass.onRender.apply(this, arguments);
}
}); // eo Ext.ux.HouseType

Ext.reg('housetype', Ext.ux.HouseType);


Any hints how to realize that? My last try was to create an own store and dataview for each tab (= each houseType) but I'm sure that's not the way Ext is made for ;-)

Cheerio,
Chris