所以我是Sencha Touch noob，我可能已经超过了我的头脑。我想要做的是从一个主列表中过滤数据，然后向下钻取。所以我有我的主要清单 - 分类。选择类别后，会出现一个位置列表。我在让模特互相交谈时遇到了问题（我认为）。现在，如果我选择一个类别，我的所有数据都会被返回，我想要的就是所选类别。我可以使用属性和指定值过滤我的商店。是否可以将值设置为我从类别菜单中传递的变量？我一直是个
这是我的代码：Category.js
app.views.CategoryList = Ext.extend(Ext.Panel, {
layout: 'card',
fullscreen: true,
scrolling: 'vertical',
initComponent: function() {
//Check if device is a phone, if so only display the title since the viewport is smaller
if (!Ext.is.Phone) {
var listTemplate = '{post_type}';
} else {
var listTemplate = '{post_type}';
}
this.list = new Ext.List({
grouped: false,
indexBar: false,
itemTpl: '{post_type}',
store: app.stores.CategoryList,
listeners: {
selectionchange: {fn: this.onSelect, scope: this}
}
});
///selectionchange : function(){
// this.store.filter('post_type', listTemplate)
//this.onSelect('post_type')
this.listpanel = new Ext.Panel({
layout: 'fit',
items: this.list,
dockedItems: [{
xtype: 'toolbar',
title: listingTitle
}],
listeners: {
activate: { fn: function(){
this.list.getSelectionModel().deselectAll();
Ext.repaint();
}, scope: this }
}
});
this.items = this.listpanel;
app.views.CategoryList.superclass.initComponent.call(this);
},
onSelect: function(sel, records){
if (records[0] !== undefined) {
var categoryCard = new app.views.LocationsList({
store: app.stores.LocationList,
//store: app.stores.LocationList.filter('post_type',null),
prevCard: this.listpanel,
record: records[0]
});
this.setActiveItem(categoryCard, 'slide');
}
}
});
Ext.reg('CategoryList', app.views.CategoryList);
LocationModel.js
//The model will load the locations information you entered in the locations.xml file after it has been fed through JSON
//Register the Location Model
Ext.regModel('Locations', {
fields: [{name: 'post_title', type: 'string'},
{name: 'post_type', type: 'string'}],
belongsTo: 'Category'
});
//Load XML data from JSON into local store
app.stores.LocationsList = new Ext.data.Store({
model: "Locations", //Model to use for the Store
/*filters: [
{
property: 'post_type',
value: null
}
],*/
sorters: [{
property: 'post_title', //Set the title as a sorter to the listing card can use the grouped list layout
direction: 'ASC'
}],
proxy: {
type: 'ajax', //Load JSON from our source defined in the config file
url: HTTP_ROOT + '/' + JSON_SOURCE,
reader: {
type: 'json',
root: 'markers1'
},
id : 'LocationsID'
},
getGroupString : function(record) {
// return the first character of the address in order to group
return record.get('post_title')[0];
},
listeners: {
'load': function (t, r, s) {
//Fire custom event once all the load is complete
Ext.dispatch({
controller: app.controllers.map,
action: 'loaded',
records: r
});
},
},
autoLoad : true //We start loading the info into the datastore immediately after the app is started to make it available ASAP
});
CategoryModel.js
//The model will load the locations information you entered in the locations.xml file after it has been fed through JSON
Ext.regModel('Category', {
fields: [
{name: 'post_type', type: 'string'},],
hasMany: {
model: 'Locations',
name : 'locations',
filterProperty: 'post_type'
}
});
var data = {
"categories":[
{"post_type":"trails"},
{"post_type":"Adventure Guides"},
{"post_type":"brew"},
{"post_type":"Festivals and Races"},
{"post_type":"Paddle and Rafting"},
{"post_type":"Parks and Forests"},
{"post_type":"Campgrounds"},
{"post_type":"Rivers, Mountains, Lakes"}
]
};
//Load XML data from JSON into local store
app.stores.CategoryList = new Ext.data.Store({
model: "Category", //Model to use for the Store
data: data,
sorters: [{
property: 'post_type', //Set the title as a sorter to the listing card can use the grouped list layout
direction: 'ASC'
}],
proxy: {
type: 'memory', //Load JSON from our source defined in the config file
//url: HTTP_ROOT + '/' + JSON_SOURCE,
reader: {
type: 'json',
root: 'categories'
},
id : 'CategoryID'
},
getGroupString : function(record) {
// return the first character of the address in order to group
return record.get('post_type')[0];
},
listeners: {
'load': function (t, r, s) {
//Fire custom event once all the load is complete
Ext.dispatch({
controller: app.controllers.map,
action: 'loaded',
records: r
});
},
},
autoLoad : true //We start loading the info into the datastore immediately after the app is started to make it available ASAP
});
答案 0 :(得分：0)
所以看起来你正在接触我现在正式生锈，但我会试一试。我使用remotefilter的尝试总是以泪流满面，所以我最后滚动自己，而不是尝试使用内置的过滤方法。 YMMV。
您可以获取商店和商店的代理，然后设置extraParams对象，该对象将被转换为get参数。您也可以这种方式修改网址。所以在过去我编写了自定义setter方法来过滤远程，因为它似乎比touch1.1内置更好。
您将抓住商店并将过滤器传递给以下方法：
setFilterParams: function(param) {
var p = this.getProxy();
p.extraParams = {filter_value: param};
// p.url also works
}
...
yourstore.load();
因此，您的主列表使用onitemtap或selectionchange从第一个（未过滤的）商店中查找记录，获取该值并应用于您的详细信息页面使用的第二个商店的setFilter。
另请注意，因为你说你是个新手。这些商店代表单件，所以如果你有两个使用同一商店的列表，如果list1过滤商店中将影响list2的数据。
答案 1 :(得分：0)
以下是您在Sencha Touch 1中如何进行所需（针对两级过滤）的方法。
//模型
App.models.States = Ext.regModel('State', {
idProperty : 'stateId',
fields : [
{ name : 'stateId', type : 'integer'},
{ name : 'state', type : 'string'}
]
});
App.models.Districts = Ext.regModel('District', {
fields : [
{ name : 'districtId', type : 'integer'},
{ name : 'stateId', type : 'integer'},
{ name : 'district', type : 'string'}
]
});
//商店
App.stores.StatesStore = new Ext.data.Store({
model : 'State',
data : [
{ stateId : 1, state : 'Maharashtra' },
{ stateId : 2, state : 'Andhra Pradesh' }
],
sorters : 'state',
autoLoad : true
});
App.stores.DistrictStore = new Ext.data.Store({
model : 'State',
data : [
{ districtId : 1, district : 'Nasik', stateId : 1 },
{ districtId : 2, district : 'Thane', stateId : 1 },
{ districtId : 3, district : 'Jalgaon', stateId : 1 },
{ districtId : 4, district : 'Hyderabad', stateId : 2 },
{ districtId : 5, district : 'Nizamabad', stateId : 2 },
{ districtId : 6, district : 'Kurnool', stateId : 2 }
],
sorters : 'district',
autoload : true
});
我已在此处内联数据，以便您可以看到它们的关联方式。现在，每个区域ID都与状态ID相关联。例如，纳西克区位于马哈拉施特拉邦境内。因此，'Nasik'的区域ID 1现在与'Maharashtra'的stateId 1相关联。
//适用于国家和地区的Selectfield区
{
xtype: 'selectfield',
name : 'state',
id : 'state',
label: 'State',
store : App.stores.StatesStore,
displayField : 'state',
valueField : 'stateId',
listeners : {
change : function(t, value){
Ext.dispatch({
controller : 'Users',
action : 'filterLocations',
data : {value:value, level : 'district'}
});
}
}
},
{
xtype: 'selectfield',
name : 'district',
id : 'district',
label: 'District',
store : App.stores.DistrictStore,
displayField : 'district',
valueField : 'districtId'
}
现在，选择字段已与我们之前创建的模型/商店相关联。
现在我们将看一下在更改状态的选择字段时调用的控制器功能。
filterLocations: function(params){
var value = params.data.value;
var level = params.data.level;
if(level == "district"){
App.stores.DistrictStore.clearFilter();
App.stores.DistrictStore.filter('stateId', value);
var firstValue = Ext.getCmp('district').store.getAt(0);
if(firstValue) Ext.getCmp('district').setValue('Select District');
}
else if(level == "block"){
App.stores.BlockStore.clearFilter();
App.stores.BlockStore.filter('districtId', value);
var firstValue = Ext.getCmp('block').store.getAt(0);
if(firstValue) Ext.getCmp('block').setValue('Select Block');
}
},
我已经为您提供了一个扩展控制器，可以支持多个级别。例如，州将过滤地区，地区可以过滤村庄等等。因此，在控制器中我们采取需要过滤的水平。如果要在州和地区之间进行过滤，则将调用第一个if条件，并且区域存储（以及因此选择字段）将被过滤以获得期望的值。