forum-search.js
2.01 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
Ext.require([
'Ext.data.*',
'Ext.form.*'
]);
Ext.onReady(function(){
Ext.define("Post", {
extend: 'Ext.data.Model',
proxy: {
type: 'jsonp',
url : 'http://www.sencha.com/forum/topics-remote.php',
reader: {
type: 'json',
root: 'topics',
totalProperty: 'totalCount'
}
},
fields: [
{name: 'id', mapping: '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'}
]
});
ds = Ext.create('Ext.data.Store', {
pageSize: 10,
model: 'Post'
});
panel = Ext.create('Ext.panel.Panel', {
renderTo: Ext.getBody(),
title: 'Search the Ext Forums',
width: 600,
bodyPadding: 10,
layout: 'anchor',
items: [{
xtype: 'combo',
store: ds,
displayField: 'title',
typeAhead: false,
hideLabel: true,
hideTrigger:true,
anchor: '100%',
listConfig: {
loadingText: 'Searching...',
emptyText: 'No matching posts found.',
// Custom rendering template for each item
getInnerTpl: function() {
return '<a class="search-item" href="http://www.sencha.com/forum/showthread.php?t={topicId}&p={id}">' +
'<h3><span>{[Ext.Date.format(values.lastPost, "M j, Y")]}<br />by {author}</span>{title}</h3>' +
'{excerpt}' +
'</a>';
}
},
pageSize: 10
}, {
xtype: 'component',
style: 'margin-top:10px',
html: 'Live search requires a minimum of 4 characters.'
}]
});
});