List Sencha触摸列表搜索不起作用

我正在试用最新的Sencha Touch 1.1.0开源distributin附带的列表搜索示例，我发现以下错误：

Ext.List: itemTpl is a required configuration.
[Break On This Error] throw new Error("Ext.List: itemTpl is a required configuration.");
sencha...ebug.js (line 23220)
WebKitPoint is not defined
[Break On This Error] var point = window.webkitConve...age(this.dom, new WebKitPoint(0, 0)); 
sencha...ebug.js (line 11612)

---

有人能帮忙吗？

试着在列表中添加一个

itemTpl

。如错误消息所示，这是列表组件工作所必需的

---

我制作了一些Sencha Touch屏幕广播，应该会有所帮助：一个在上，一个在（和）上，由两部分组成的系列。

将“tpl”项从listConfig更改为itemTpl，列表至少会呈现出来。但是看看这个例子，我不确定它是否起作用。它将搜索字段作为列表中的停靠项，但我认为您不能将项目停靠在列表中。它应该包装在面板中，面板中有停靠的项目，列表作为面板项目。James Pearce展示了如何使用Sencha教程在PhoneGap MVC中进行布局的示例：

上面写着：

不幸的是，不可能将工具栏直接停靠到Ext.List上，因此面板包装器

---

因此，列表搜索示例似乎已经过时了（我也在看1.1.0版）。

我使用mikerowehl的建议修改了index.js以正确运行。如果有人需要，请看这里：

    Ext.regModel('Contact', {
            fields: ['firstName', 'lastName']
        });


    myStore = new Ext.data.JsonStore({
            model  : 'Contact',
            sorters: 'lastName',
            getGroupString : function(record) {
                return record.get('lastName')[0];
            },

            data: [
                {firstName: 'Tommy',   lastName: 'Maintz'},
                {firstName: 'Rob',     lastName: 'Dougan'},
                {firstName: 'Ed',      lastName: 'Spencer'},
                {firstName: 'Jamie',   lastName: 'Avins'},
                {firstName: 'Aaron',   lastName: 'Conran'},
                {firstName: 'Dave',    lastName: 'Kaneda'},
                {firstName: 'Michael', lastName: 'Mullany'},
                {firstName: 'Abraham', lastName: 'Elias'},
                {firstName: 'Jay',     lastName: 'Robinson'},
                {firstName: 'Tommy',   lastName: 'Maintz'},
                {firstName: 'Rob',     lastName: 'Dougan'},
                {firstName: 'Ed',      lastName: 'Spencer'},
                {firstName: 'Jamie',   lastName: 'Avins'},
                {firstName: 'Aaron',   lastName: 'Conran'},
                {firstName: 'Dave',    lastName: 'Kaneda'},
                {firstName: 'Michael', lastName: 'Mullany'},
                {firstName: 'Abraham', lastName: 'Elias'},
                {firstName: 'Jay',     lastName: 'Robinson'}
            ]
    });

    Ext.setup({
    tabletStartupScreen: 'tablet_startup.png',
    phoneStartupScreen : 'phone_startup.png',    
    icon       : 'icon.png',
    glossOnIcon: false,

    onReady: function() {
         var listConfig = {
            dockedItems: [
                {
                    xtype: 'toolbar',
                    dock : 'top',

                    items: [
                        {xtype: 'spacer'},
                        {
                            xtype      : 'textfield',
                            placeHolder: 'Search...',
                            listeners  : {
                                scope: this,

                                keyup: function(field) {
                                    var value = field.getValue();

                                    if (!value) {
                                        myStore.filterBy(function() {
                                            return true;
                                        });
                                    } else {
                                        var searches = value.split(' '),
                                            regexps  = [],
                                            i;

                                        for (i = 0; i < searches.length; i++) {
                                            if (!searches[i]) return;
                                            regexps.push(new RegExp(searches[i], 'i'));
                                        };

                                        myStore.filterBy(function(record) {
                                            var matched = [];

                                            for (i = 0; i < regexps.length; i++) {
                                                var search = regexps[i];

                                                if (record.get('firstName').match(search) || record.get('lastName').match(search)) matched.push(true);
                                                else matched.push(false);
                                            };

                                            if (regexps.length > 1 && matched.indexOf(false) != -1) {
                                                return false;
                                            } else {
                                                return matched[0];
                                            }
                                        });
                                    }
                                }
                            }
                        },
                        {xtype: 'spacer'},                        
                    ]
                }
            ]
        };

        if (!Ext.is.Phone) {
            new Ext.Panel(Ext.apply(listConfig, {
                floating     : true,
                width        : 380,
                height       : 420,
                centered     : true,
                modal        : true,
                hideOnMaskTap: false,
                items:
        {
            xtype:'list',
            itemTpl : '<tpl for="."><div class="contact">{firstName} <strong>{lastName}</strong></div></tpl>',

            itemSelector: 'div.contact',
            singleSelect: true,
            grouped     : true,

            store: myStore,
        },
            })).show();
        } else {
            new Ext.Panel(Ext.apply(listConfig, {                       
                fullscreen: true,
                items:
        {
            xtype:'list',
            itemTpl : '<tpl for="."><div class="contact">{firstName} <strong>{lastName}</strong></div></tpl>',
            itemSelector: 'div.contact',
            singleSelect: true,
            grouped     : true,
            store: myStore,
        },
            }));
        }
    }
});

Ext.regModel（'Contact'{
字段：['firstName'，'lastName']
});
myStore=new Ext.data.JsonStore({
型号：“联系人”，
分拣员：“姓氏”，
getGroupString:函数（记录）{
返回记录。get（'lastName'）[0]；
},
数据：[
{姓：“汤米”，姓“美因茨”}，
{姓氏：“Rob”，姓氏“Dougan”}，
{firstName:'Ed'，lastName:'Spencer'}，
{姓：“杰米”，姓“阿文斯”}，
{姓：“亚伦”，姓“康兰”}，
{姓：“戴夫”，姓“金田”}，
{姓：“迈克尔”，姓“穆拉尼”}，
{姓：“亚伯拉罕”，姓“以利亚”}，
{姓：杰，姓：罗宾逊}，
{姓：“汤米”，姓“美因茨”}，
{姓氏：“Rob”，姓氏“Dougan”}，
{firstName:'Ed'，lastName:'Spencer'}，
{姓：“杰米”，姓“阿文斯”}，
{姓：“亚伦”，姓“康兰”}，
{姓：“戴夫”，姓“金田”}，
{姓：“迈克尔”，姓“穆拉尼”}，
{姓：“亚伯拉罕”，姓“以利亚”}，
{姓：杰，姓：罗宾逊}
]
});
外部设置({
TabletStartup屏幕：“tablet_startup.png”，
phoneStartupScreen:'phone_startup.png'，
图标：“icon.png”，
格洛松尼康：错，
onReady:function（）{
var listConfig={
摘要：[
{
xtype:'工具栏'，
码头：“顶部”，
项目：[
{xtype:'间隔'}，
{
xtype:'textfield'，
占位符：“搜索…”，
听众：{
范围:本,，
键控：功能（字段）{
var value=field.getValue（）；
如果（！值）{
myStore.filterBy（函数（）{
返回true；
});
}否则{
var搜索=value.split（“”），
regexps=[]，
我
对于（i=0；i1&&matched.indexOf（false）！=-1）{
返回false；
}否则{
返回匹配的[0]；
}
});
}
}
}
},
{xtype:'间隔'}，
]
}
]
};
如果（！Ext.is.Phone）{
新的Ext.Panel（Ext.apply（listConfig{
浮动：是的，
宽度：380，
身高：420，
对,，
莫代尔：是的，
hideOnMaskTap：错，
项目：
{
xtype:“列表”，
itemTpl:“{firstName}{lastName}”，
项目选择器：“div.contact”，
singleSelect:true，
对,，
商店：myStore，
},
}))