JavaScript DHTML/Ext JS/Auto Complete

Материал из Web эксперт
Перейти к: навигация, поиск

Autocomplete based on remote Json array

   <source lang="html4strict">

Use JsonReader to read Json data Pageable dropdown panel <html> <head> <title>Hello World Window</title> <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /> <script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext-3.0.0/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function() { 

     Ext.QuickTips.init();
   
       var ds = new Ext.data.Store({
           proxy: new Ext.data.ScriptTagProxy({
               url: "http://extjs.ru/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.ruboBox({
           store        : ds,
           fieldLabel   : "Query string",
           displayField : "title",
           typeAhead    : true,
           loadingText  : "Searching...",
           pageSize     : 5,
           renderTo     : Ext.getBody(),
           width        : 200
       });

}); </script>

asdf

</body> </html> 

 </source>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/Ext_JS/Auto_Complete&oldid=2349»