examples/form/forum-search.js

   1 /*!
   2  * Ext JS Library 3.2.0
   3  * Copyright(c) 2006-2010 Ext JS, Inc.
   4  * licensing@extjs.com
   5  * http://www.extjs.com/license
   6  */
   7 Ext.onReady(function(){
   8
   9     var ds = new Ext.data.Store({
  10         proxy: new Ext.data.ScriptTagProxy({
  11             url: 'http://extjs.com/forum/topics-remote.php'
  12         }),
  13         reader: new Ext.data.JsonReader({
  14             root: 'topics',
  15             totalProperty: 'totalCount',
  16             id: 'post_id'
  17         }, [
  18             {name: 'title', mapping: 'topic_title'},
  19             {name: 'topicId', mapping: 'topic_id'},
  20             {name: 'author', mapping: 'author'},
  21             {name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'},
  22             {name: 'excerpt', mapping: 'post_text'}
  23         ])
  24     });
  25
  26     // Custom rendering Template
  27     var resultTpl = new Ext.XTemplate(
  28         '<tpl for="."><div class="search-item">',
  29             '<h3><span>{lastPost:date("M j, Y")}<br />by {author}</span>{title}</h3>',
  30             '{excerpt}',
  31         '</div></tpl>'
  32     );
  33
  34     var search = new Ext.form.ComboBox({
  35         store: ds,
  36         displayField:'title',
  37         typeAhead: false,
  38         loadingText: 'Searching...',
  39         width: 570,
  40         pageSize:10,
  41         hideTrigger:true,
  42         tpl: resultTpl,
  43         applyTo: 'search',
  44         itemSelector: 'div.search-item',
  45         onSelect: function(record){ // override default onSelect to do redirect
  46             window.location =
  47                 String.format('http://extjs.com/forum/showthread.php?t={0}&p={1}', record.data.topicId, record.id);
  48         }
  49     });
  50 });