docs/source/forum-search.html

   1 <html>\r
   2 <head>\r
   3   <title>The source code</title>\r
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   6 </head>\r
   7 <body  onload="prettyPrint();">\r
   8     <pre class="prettyprint lang-js">Ext.onReady(function(){
   9
  10     var ds = new Ext.data.Store({
  11         proxy: new Ext.data.ScriptTagProxy({
  12             url: 'http://extjs.com/forum/topics-remote.php'
  13         }),
  14         reader: new Ext.data.JsonReader({
  15             root: 'topics',
  16             totalProperty: 'totalCount',
  17             id: 'post_id'
  18         }, [
  19             {name: 'title', mapping: 'topic_title'},
  20             {name: 'topicId', mapping: 'topic_id'},
  21             {name: 'author', mapping: 'author'},
  22             {name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'},
  23             {name: 'excerpt', mapping: 'post_text'}
  24         ])
  25     });
  26
  27     // Custom rendering Template
  28     var resultTpl = new Ext.XTemplate(
  29         '<tpl for="."><div class="search-item">',
  30             '<h3><span>{lastPost:date("M j, Y")}<br />by {author}</span>{title}</h3>',
  31             '{excerpt}',
  32         '</div></tpl>'
  33     );
  34
  35     var search = new Ext.form.ComboBox({
  36         store: ds,
  37         displayField:'title',
  38         typeAhead: false,
  39         loadingText: 'Searching...',
  40         width: 570,
  41         pageSize:10,
  42         hideTrigger:true,
  43         tpl: resultTpl,
  44         applyTo: 'search',
  45         itemSelector: 'div.search-item',
  46         onSelect: function(record){ // override default onSelect to do redirect
  47             window.location =
  48                 String.format('http://extjs.com/forum/showthread.php?t={0}&p={1}', record.data.topicId, record.id);
  49         }
  50     });
  51 });</pre>    \r
  52 </body>\r
  53 </html>