Estoy realizando una web app con Sencha Touch 2, pueden verla en Webapp, el error lo voy a describir con un ejemplo:
1. Usar el filtro y escribir la palabra 'Redds', nos arroja 1 solo item
2. Escribir cualquier número en el textfield
3. Quitar el filtro usando el icono a lado derecho o eliminando la palabra
Si todo se hizo correctamente notarán que el número escrito anteriormente no está en el item 'Redds', si no en el primer item, que en este caso es 'Poker'.
Alguno tiene alguna idea del porqué sucede esto?
Estos son los archivos que uso para crear la lista:
List.js(Vista que contiene el DataView)
Código PHP:
Ext.define('DEMO.view.product.List', {
extend: 'Ext.DataView',
xtype: 'product-list',
requires: ['DEMO.view.product.ListItem'],
config: {
items:[
{
xtype: 'toolbar',
docked: 'top',
items: [
{xtype: 'spacer'},
{
xtype: 'searchfield',
placeHolder: 'Buscar...'
},
{xtype: 'spacer'}
]
}
],
xtype: 'dataview',
useComponents: true,
cls: 'product-list',
store: 'Product',
defaultType: 'product-list-item'
}
});
Código PHP:
Ext.define('DEMO.view.product.ListItem', {
extend: 'Ext.dataview.component.DataItem',
requires: ['DEMO.view.product.QuantityComponent'],
xtype: 'product-list-item',
config: {
cls: 'product-list-item',
dataMap: {
getImage: {
setSrc: 'img'
},
getName: {
setHtml: 'name'
},
getQuantity: {
setQuantityComponent: ''
}
},
image: {
docked: 'left'
},
name: {
cls: 'x-name'
},
quantity: {},
layout: {
type: 'vbox'
}
},
applyImage: function(config){
return Ext.factory(config, Ext.Img, this.getImage());
},
updateImage: function(newImage, oldImage) {
if (newImage) {
this.add(newImage);
}
if (oldImage) {
this.remove(oldImage);
}
},
applyName: function(config){
return Ext.factory(config, Ext.Component, this.getName());
},
updateName: function(newName, oldName) {
if (newName) {
this.add(newName);
}
if (oldName) {
this.remove(oldName);
}
},
applyQuantity: function(config) {
return Ext.factory(config, DEMO.view.product.QuantityComponent, this.getQuantity());
},
updateQuantity: function(newQuantity) {
if (newQuantity) {
this.add(newQuantity);
}
}
});
Código PHP:
Ext.define('DEMO.view.product.QuantityComponent', {
extend: 'Ext.Panel',
config: {
quantityComponent: '',
cls: 'quantity-component'
},
updateQuantityComponent: function() {
this.add([
{
xtype: 'numberfield',
label: 'Cantidad',
maxLength: 5,
stepValue: 1,
placeHolder: '0',
clearIcon: false,
labelWidth: 85,
labelCls: 'quantity-component-label-qty'
}
]);
}
});
Código PHP:
Ext.define('DEMO.controller.Global', {
extend: 'Ext.app.Controller',
config: {
refs: {
Searcher: 'searchfield'
},
control: {
Searcher: {
clearicontap: 'onClearSearcherList',
keyup: 'onSearchInList'
}
}
},
onSearchInList: function(searcher){
var p = Ext.apply({}, {}, {
searcher: searcher,
store: searcher.getParent().getParent().getStore()
});
try{
if(Validate.isEmpty(p.searcher, p.store) || !Validate.isStore(p.store))
return;
var store = Ext.getStore(p.store),
value = p.searcher.getValue();
store.clearFilter();
if(value){
var filters = [];
filters.push({
property: 'name',
value : value
});
store.clearFilter();
store.filter(filters);
store.load();
}
}
catch(Exc){
Tools.fireExc(Exc);
}
},
onClearSearcherList: function(searcher){
var p = Ext.apply({}, {}, {
store: searcher.getParent().getParent().getStore()
});
try{
if(Validate.isStore(p.store)){
Ext.getStore(p.store).clearFilter();
}
}
catch(Exc){
Tools.fireExc(Exc);
}
}
});