ext 2.0 Combos 使用指南

最新推荐文章于 2024-09-24 10:17:01 发布
最新推荐文章于 2024-09-24 10:17:01 发布
阅读量332 收藏
点赞数
分类专栏： javascript 文章标签： ext localization stylesheet function html image
 

这是个简单的例子,只需要简单的解释下,按步就班,从简单到复杂!

例子由两部分组成:lcombo.html 和 lcombo.js.

lcombo.html

view plain copy to clipboard print ?
  1. <!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01 Transitional//EN"    
  2.     "http://www.w3.org/TR/html4/loose.dtd" >  
  3. <html>  
  4. <head>  
  5.     <meta http-equiv="Content-Type"  content= "text/html; charset=utf-8" >  
  6.     <link rel="stylesheet"  type= "text/css"  href= "../extjs-2.0/resources/css/ext-all.css" >  
  7.     <script type="text/javascript"  src= "../extjs-2.0/adapter/ext/ext-base.js" ></script>  
  8.     <script type="text/javascript"  src= "../extjs-2.0/ext-all-debug.js" ></script>  
  9.     <script type="text/javascript"  src= "lcombo.js" ></script>  
  10.     <!-- A Localization Script File comes here -->  
  11.     <script type="text/javascript" >  
  12.         Ext.onReady(LCombo.app.init, LCombo.app);  
  13.     </script>  
  14.     <title>Linked Combos Example</title>  
  15. </head>  
  16. <body>  
  17. </body>  
  18. </html>  

这是ext运用的最小html!
不要忘记改变ext类库和资源的引用来部署你的ext!

lcombo.js

view plain copy to clipboard print ?
  1. /**  
  2.   * Ext 2.0 Linked Combos Tutorial  
  3.   * by Jozef Sakalos, aka Saki  
  4.   * extjs.com/learn/Tutorial:Linked_Combos_Tutorial_for_Ext_2  
  5.   */   
  6.    
  7. // reference local blank image   
  8. Ext.BLANK_IMAGE_URL = '../extjs-2.0/resources/images/default/s.gif' ;  
  9.    
  10. Ext.namespace('LCombo' ,  'LCombo.countries' ,  'LCombo.cities' );  
  11.    
  12. LCombo.countries = [  
  13.      ['USA' ,  'United States of America' ]  
  14.     ,['D' ,  'Germany' ]  
  15.     ,['F' ,  'France' ]  
  16.     ,['GB' ,  'Great Britain' ]  
  17. ];  
  18.    
  19. LCombo.cities = [  
  20.      [1, 'USA' ,  'New York' ]  
  21.     ,[2, 'USA' ,  'Cleveland' ]  
  22.     ,[3, 'USA' ,  'Austin' ]  
  23.     ,[4, 'USA' ,  'Los Angeles' ]  
  24.     ,[5, 'D' ,  'Berlin' ]  
  25.     ,[6, 'D' ,  'Bonn' ]  
  26.     ,[7, 'F' ,  'Paris' ]  
  27.     ,[8, 'F' ,  'Nice' ]  
  28.     ,[9, 'GB' ,  'London' ]  
  29.     ,[10, 'GB' ,  'Glasgow' ]  
  30.     ,[11, 'GB' ,  'Liverpool' ]  
  31. ];  
  32.    
  33. // create application   
  34. LCombo.app = function () {  
  35.     // do NOT access DOM from here; elements don't exist yet   
  36.    
  37.     // private variables   
  38.    
  39.     // private functions   
  40.    
  41.     // public space   
  42.     return  {  
  43.    
  44.         // public methods   
  45.         init: function () {  
  46.             var  form =  new  Ext.FormPanel({  
  47.                  renderTo:document.body  
  48.                 ,width: 400  
  49.                 ,height: 300  
  50.                 ,style:'margin:16px'   
  51.                 ,bodyStyle:'padding:10px'   
  52.                 ,title:'Linked Combos'   
  53.                 ,defaults: {xtype:'combo' }  
  54.                 ,items:[{  
  55.                      fieldLabel:'Select Country'   
  56.                     ,displayField:'country'   
  57.                     ,valueField:'cid'   
  58.                     ,store: new  Ext.data.SimpleStore({  
  59.                          fields:['cid' ,  'country' ]  
  60.                         ,data:LCombo.countries  
  61.                     })  
  62.                     ,triggerAction:'all'   
  63.                     ,mode:'local'   
  64.                     ,listeners:{select:{fn:function (combo, value) {  
  65.                         var  comboCity = Ext.getCmp( 'combo-city' );          
  66.                         comboCity.setValue('' );  
  67.                         comboCity.store.filter('cid' , combo.getValue());  
  68.                         }}  
  69.                     }  
  70.    
  71.                 },{  
  72.                      fieldLabel:'Select City'   
  73.                     ,displayField:'city'   
  74.                     ,valueField:'id'   
  75.                     ,id:'combo-city'   
  76.                     ,store: new  Ext.data.SimpleStore({  
  77.                          fields:['id' ,  'cid' ,  'city' ]  
  78.                         ,data:LCombo.cities  
  79.                     })  
  80.                     ,triggerAction:'all'   
  81.                     ,mode:'local'   
  82.                     ,lastQuery:''   
  83.                 }]  
  84.             });  
  85.         }  
  86.     };  
  87. }(); // end of app   
  88.    
  89. // end of file  
kinglino520
关注
专栏目录
10_million_password_list_top_1000000.txt
06-05
有换行，可以实现读取： 10_million_password_list_top_1000000.txt
10-million-combos.txt
07-04
安全研究员 Mark Burnett公开了一千万密码（10-million-combos.zip）
ExtJs多级联动菜单的一种实现
weixin_30642561的博客
06-08 112
1.ExtJs中的Combos控件，定义数据源store的时候可以采用下面的方式： 代码 varstore=newExt.data.SimpleStore({//定义组合框中显示的数据源//fields:['Item','ItemValue'],fields:['Item...
EXT2.0官方教程中文版
peak
01-24 374
Ext 2 Overview (EXT2.0概述,来自官方)ext 2.0 Combos 使用指南EXT 树的拖放EXT 的继承 Manual:Intro:InheritanceJavascript中的作用域（scope）Manual:Core:Ext.Ajax 类Manual:Core:Working with JSON (EXT 与json的交互)Manual:Ext Source Overv...
EXT教程
陌上霜寒的专栏
03-24 174
Ext 2 Overview (EXT2.0概述,来自官方)[url]http://www.dojochina.com/?q=node/548[/url] ext 2.0 Combos 使用指南[url]http://www.dojochina.com/?q=node/526[/url] EXT 树的拖放[url]http://www.dojochina.com/?q=node/522[/ur...
android linux 基础知识总结
bzw73的专栏
10-17 3487
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ linux ，Android基础知识总结 1. Android编译系统分析 2. 文件系统分析 3. 制作交叉工具链 4. 软件编译常识 5. 设置模块流程分析 6. linux系统启动流程分析 7. linux下svn使用指南 8. LFS 相关 9. linux 内核的初
linux ，Android基础知识总结
ConceptCon
05-15 2421
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ linux ，Android基础知识总结 1. Android编译系统分析 2. 文件系统分析 3. 制作交叉工具链 4. 软件编译常识 5. 设置模块流程分析 6. linux系统启动流程分析 7. linux下svn使用指南 8. LFS 相关 9. linux 内核的初
[转]android 基础知识
a3015440的专栏
05-27 2478
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝linux ，Android基础知识总结1. Android编译系统分析2. 文件系统分析3. 制作交叉工具链4. 软件编译常识5. 设置模块流程分析6. linux系统启动流程分析7. linux下svn使用指南8. LFS 相关9. linux 内核的初
Ext2.x扩展控件（里面共有67个扩展控件）
06-17
这个压缩包是本人从Ext官方论坛收集的用户扩展控件，针对EXT版本2.x，里面有树表格，图表控件，上传控件，表格过滤控件，通知窗口控件等等。 大部分解压后放入ext的example文件夹下就可以运行，有少数几个需要部署到...
GAC(Great Animation Combos) System v1.8.4
07-08
Want to create an action game that allows you to perform combos? The GAC (Great Animation Combos) System is created just for that. Create 3D/2D games that take your animations and seamlessly provides ...
Suunto松拓SUUNTO COMBOS用户手册.pdf
02-11
本手册还提供了Suunto设备的安装和使用方法，包括Suunto COMBO控制台的组装、安装深度计和压力计、安装指南针等。同时，本手册还提供了潜水安全须知和设备维护方法等方面的指导。 本手册是Suunto松拓SUUNTO COMBO...
ext定制:搜索框
04-27
- 除了全局样式文件`ext-all.css`之外，还引入了一个专门针对搜索框的样式文件`combos.css`。 - 内联样式部分定义了搜索结果列表的具体样式规则，包括链接的样式、列表项的内边距等。 通过上述步骤和细节，我们...
linux 基础知识总结
石头的专栏
07-08 1985
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ linux ，Android基础知识总结 1. Android编译系统分析 2. 文件系统分析 3. 制作交叉工具链 4. 软件编译常识 5. 设置模块流程分析 6. linux系统启动流程分析 7. linux下svn使用指南 8. LFS 相关 9. linux 内核的初
Android基础知识总结（转载）
Aaron
02-24 3572
<br />＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ linux ，Android基础知识总结 1. Android编译系统分析 2. 文件系统分析 3. 制作交叉工具链 4. 软件编译常识 5. 设置模块流程分析 6. linux系统启动流程分析 7. linux下svn使用指南 8. LFS 相关 9. linux 内核的初步理解＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
html TAB切换按钮变色、自动生成table
最新发布
TrueLink的博客
09-24 452
/ 为当前点击的按钮添加.active-tab类。/* 文本颜色变为白色，以便在蓝色背景上可见 */// 移除所有按钮的.active-tab类。/* 鼠标悬停时显示手指形状 */// 动态生成选项卡头部和内容。// 动态生成选项卡头部和内容。/* 选中时背景色变为蓝色 */// 默认显示第一个选项卡的内容。/* 增加内边距以便点击 */// 显示对应的选项卡内容。/* 初始背景色透明 *//* 添加一些间隔 */// 更多数据...// 更多数据.../* 简单的样式 */
web基础：域名、网页、HTML、web版本
shyuu的博客
09-23 1470
web（World Wide Web）即全球广域网，也称为万维网，它是一种基于超文本和HTTP的、全球性的、动态交互的、跨平台的分布式图形信息系统。是建立在Internet上的一种网络服务，为浏览者在Internet上查找和浏览信息提供了图形化的、易于访问的直观界面，其中的文档及超级链接将Internet上的信息节点组织成一个互为关联的网状结构。
HTML粉色烟花秀
兔子王
09-21 5894
HTML语言实现的粉红色跨年烟花秀的完整代码。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值