multi-lang.js
上传用户:dawnssy
上传日期:2022-08-06
资源大小:9345k
文件大小:5k
源码类别:

JavaScript

开发平台:

JavaScript

  1. /*!
  2.  * Ext JS Library 3.1.0
  3.  * Copyright(c) 2006-2009 Ext JS, LLC
  4.  * licensing@extjs.com
  5.  * http://www.extjs.com/license
  6.  */
  7. MultiLangDemo = function() {
  8.     // get the selected language code parameter from url (if exists)
  9.     var params = Ext.urlDecode(window.location.search.substring(1));
  10.     Ext.form.Field.prototype.msgTarget = 'side';
  11.                 
  12.     return {
  13.         init: function() {
  14.             Ext.QuickTips.init();
  15.             
  16.             /* Language chooser combobox  */
  17.             var store = new Ext.data.ArrayStore({
  18.                 fields: ['code', 'language', 'charset'],
  19.                 data : Ext.exampledata.languages // from languages.js
  20.             });
  21.             var combo = new Ext.form.ComboBox({
  22.                 renderTo: 'languages',
  23.                 store: store,
  24.                 displayField:'language',
  25.                 typeAhead: true,
  26.                 mode: 'local',
  27.                 triggerAction: 'all',
  28.                 emptyText: 'Select a language...',
  29.                 selectOnFocus: true,
  30.                 onSelect: function(record) {
  31.                     window.location.search = Ext.urlEncode({"lang":record.get("code"),"charset":record.get("charset")});
  32.                 }
  33.             });
  34.         
  35.             if (params.lang) {
  36.                 // check if there's really a language with that language code
  37.                 record = store.data.find(function(item, key){
  38.                     if (item.data.code == params.lang) {
  39.                         return true;
  40.                     }
  41.                     return false;
  42.                 });
  43.                 // if language was found in store assign it as current value in combobox
  44.                 if (record) {
  45.                     combo.setValue(record.data.language);
  46.                 }
  47.             }            
  48.             
  49.             if (params.lang) {
  50.                 var url = String.format("../../src/locale/ext-lang-{0}.js", params.lang);
  51.                 
  52.                 Ext.Ajax.request({
  53.                     url: url,
  54.                     success: this.onSuccess,
  55.                     failure: this.onFailure,
  56.                     scope: this 
  57.                 });
  58.             } else {
  59.                 this.setupDemo();
  60.             }
  61.         },
  62.         onSuccess: function(response, opts) {
  63.             eval(response.responseText);
  64.             this.setupDemo();
  65.         },
  66.         onFailure: function() {
  67.             Ext.Msg.alert('Failure', 'Failed to load locale file.');
  68.             this.setupDemo();
  69.         },
  70.         setupDemo: function() {
  71.             /* Email field */
  72.             var emailfield = new Ext.FormPanel({
  73.                 renderTo: 'emailfield',
  74.                 labelWidth: 100, // label settings here cascade unless overridden
  75.                 frame: true,
  76.                 title: 'Email Field',
  77.                 bodyStyle: 'padding:5px 5px 0',
  78.                 width: 360,
  79.                 defaults: {width: 220},
  80.                 defaultType: 'textfield',
  81.         
  82.                 items: [{
  83.                     fieldLabel: 'Email',
  84.                     name: 'email',
  85.                     vtype: 'email'
  86.                 }]
  87.             });
  88.             
  89.             /* Datepicker */
  90.             var datefield = new Ext.FormPanel({
  91.                 renderTo: 'datefield',
  92.                 labelWidth: 100, // label settings here cascade unless overridden
  93.                 frame: true,
  94.                 title: 'Datepicker',
  95.                 bodyStyle: 'padding:5px 5px 0',
  96.                 width: 360,
  97.                 defaults: {width: 220},
  98.                 defaultType: 'datefield',
  99.                 items: [{
  100.                     fieldLabel: 'Date',
  101.                     name: 'date'
  102.                 }]
  103.             });
  104.             
  105.             // shorthand alias
  106.             var fm = Ext.form, Ed = Ext.grid.GridEditor;
  107.         
  108.             var monthArray = Date.monthNames.map(function (e) { return [e]; });
  109.         
  110.             var ds = new Ext.data.Store({
  111.                 proxy: new Ext.ux.data.PagingMemoryProxy(monthArray),
  112.                 reader: new Ext.data.ArrayReader({}, [
  113.                     {name: 'month'}
  114.                 ])
  115.             });
  116.         
  117.             var cm = new Ext.grid.ColumnModel([{
  118.                 header: "Months of the year",
  119.                 dataIndex: 'month',
  120.                 editor: new Ed(new fm.TextField({
  121.                     allowBlank: false
  122.                 })),
  123.                 width: 240,
  124.                 defaultSortable: true
  125.             }]);
  126.         
  127.             var grid = new Ext.grid.GridPanel({
  128.                 renderTo: 'grid',
  129.                 width: 360,
  130.                 height: 203,
  131.                 title:'Month Browser',
  132.                 store: ds,
  133.                 cm: cm,
  134.                 sm: new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
  135.             
  136.                 bbar: new Ext.PagingToolbar({
  137.                         pageSize: 6,
  138.                         store: ds,
  139.                         displayInfo: true
  140.                 })
  141.             });
  142.             
  143.             // trigger the data store load
  144.             ds.load({params:{start:0, limit:6}});            
  145.         }
  146.     };
  147.     
  148. }();
  149. Ext.onReady(MultiLangDemo.init, MultiLangDemo);