本文内容
- 概述
- 演示 Ext.Net.Combox AutoComplete 功能
- 说明
概述
最近用 Ext.Net 开发软件，研究了一下它的 AutoComplete 功能。虽然暂时用不到，但是一个 Web 应用程序几个经典的功能点，早晚都会用到……一般我们用一个 Ajax 框架，都会先研究它的前后台交互方式，将几个经典功能封装……等等，了解它的设计思想。
本来想模仿 jQuery 的 AutoComplete 功能，利用 Ext.Net 实现一个，但是后来在一个外国网站，看到它 Ext.Net.Combox 自带这个功能。
演示 Ext.Net.Combox AutoComplete 功能
下面演示如何用 Ext.Net.Combox 实现 AutoComplete 功能。
脚本方式
>
Ext.onReady(function() {
Ext.QuickTips.init();
var ds = new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
url: 'http://extjs.com/forum/topics-remote.php'
}),
reader: new Ext.data.JsonReader({
root: 'topics',
totalProperty: 'totalCount',
id: 'post_id'
},
[{ name: 'title', mapping: 'topic_title' },
{ name: 'topicId', mapping: 'topic_id' },
{ name: 'author', mapping: 'author' },
{ name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp' },
{ name: 'excerpt', mapping: 'post_text'}]
)
});
var search = new Ext.form.ComboBox({
store: ds,
fieldLabel: 'AutoComplete',
displayField: 'title',
typeAhead: true,
loadingText: '查找...',
pageSize: 10,
renderTo: Ext.getBody(),
width: 400
});
});
</script>