--- /dev/null
+/*!
+ * Ext JS Library 3.1.1
+ * Copyright(c) 2006-2010 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+Ext.onReady(function(){\r
+ var ds = new Ext.data.Store({\r
+ proxy: new Ext.data.ScriptTagProxy({\r
+ url: 'http://extjs.com/forum/topics-remote.php'\r
+ }),\r
+ reader: new Ext.data.JsonReader({\r
+ root: 'topics',\r
+ totalProperty: 'totalCount',\r
+ id: 'post_id'\r
+ }, [\r
+ {name: 'postId', mapping: 'post_id'},\r
+ {name: 'title', mapping: 'topic_title'},\r
+ {name: 'topicId', mapping: 'topic_id'},\r
+ {name: 'author', mapping: 'author'},\r
+ {name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'},\r
+ {name: 'excerpt', mapping: 'post_text'}\r
+ ]),\r
+\r
+ baseParams: {limit:20, forumId: 4}\r
+ });\r
+\r
+ // Custom rendering Template for the View\r
+ var resultTpl = new Ext.XTemplate(\r
+ '<tpl for=".">',\r
+ '<div class="search-item">',\r
+ '<h3><span>{lastPost:date("M j, Y")}<br />by {author}</span>',\r
+ '<a href="http://extjs.com/forum/showthread.php?t={topicId}&p={postId}" target="_blank">{title}</a></h3>',\r
+ '<p>{excerpt}</p>',\r
+ '</div></tpl>'\r
+ );\r
+\r
+ var panel = new Ext.Panel({\r
+ applyTo: 'search-panel',\r
+ title:'Forum Search',\r
+ height:500,\r
+ autoScroll:true,\r
+\r
+ items: new Ext.DataView({\r
+ tpl: resultTpl,\r
+ store: ds,\r
+ itemSelector: 'div.search-item'\r
+ }),\r
+\r
+ tbar: [\r
+ 'Search: ', ' ',\r
+ new Ext.ux.form.SearchField({\r
+ store: ds,\r
+ width:520\r
+ })\r
+ ],\r
+\r
+ bbar: new Ext.PagingToolbar({\r
+ store: ds,\r
+ pageSize: 20,\r
+ displayInfo: true,\r
+ displayMsg: 'Topics {0} - {1} of {2}',\r
+ emptyMsg: "No topics to display"\r
+ })\r
+ });\r
+\r
+ ds.load({params:{start:0, limit:20, forumId: 4}});\r
+});\r