extjs3 gridpanel 下拉框列
extjs中的表格功能非常强大，包括了排序、缓存、拖动、隐藏某一列、自动显示行号、列汇总、单元格编辑等实用功能。 表格由类Ext.grid.gridpanel定义，继承自Panel，其xtype为grid。extjs中，表格Grid必须包含列定义信息，并指定表格的数据存储器Store。表格的列信息由类Ext.grid.ColumnModel定义、而表格的数据存储器由Ext.data.Store定义，数据存储器根据解析的数据不同分为SimpleStroe、JsonStore、GroupingStore等。 1、...
by wlcacc - Java文档中心 - 2009-09-01 17:49:16 阅读（2268） 回复（0）
首先,两个下拉框,第一个下拉框首先load数据源,在select的事件中在load第二个数据源,这就是一个简单的二级联动的实现原理了. Js代码 // 第一个下拉框 var parentStore = new Ext.data.Store({ proxy: new Ext.data.HttpProxy({ url: 'loadByParentid.action?parentid=1001' }), reader: new Ext.data.JsonReader({ root: 'list', id: 'id' }, [ {name: 'id', mapping:...
4、Form 布局 Form 布局由类Ext.layout.FormLayout 定义，名称为form，是一种专门用于管理表单中输入字段的布局，这种布局主要用于在程序中创建表单字段或表单元素等使用。看下面的代码： /// Ext.onReady(function(){ new Ext.Panel({ renderTo:"hello", title:"容器组件", width:300, layout:"form", hideLabels:false, labelAlign:"right", height:120, ...
1、Border 布局 Border 布局由类Ext.layout.BorderLayout定义，布局名称为border。该布局把容器分成东南西北中五个区域，分别由east，south, west，north, cente来表示，在往容器中添加子元素的时候，我们只需要指定这些子元素所在的位置，Border布局会自动把子元素放到布局指定的位置。看下面的代码： /// Ext.onReady(function(){ new Ext.Viewport({ layout:"border", items:[ { ...
extjs中窗口是由Ext.Window类定义，该类继承自Panel，因此窗口其实是一种特殊的面板Panel。窗口包含了浮动、可拖动、可关闭、最大化、最小化等特性。看下面的代码： /// Ext.onReady(function(){ Ext.get("btn").on("click",newWin); }); var i=0; function newWin() { var win=new Ext.Window({ title:"窗口"+i++, width:400, height:300, ...
在学习了HelloWorld之后，下面来看一下面板。这里不再帖出所有代码。 保持HelloWorld中HTML页面内容不变。只里只更改firstJs.js文件。 如下所示： VeiwPort代表整个浏览器显示区域，该对象渲染到页面的body区域，并会随着浏览器显示区域的大小自动改变，一个页面中只能有一个ViewPort实例。看下面的代码： Ext.onReady(function() { new Ext.Viewport({ enableTabScroll : true, layout : "fit", ...
本人在运行这个实例时，在IE6中是空白，什么都不显示。在FF中正常。原创作者不知在IE中测试过没> 下面来看一个比较复杂的人员信息实例，实例功能登记人员信息，人员的出生日期跟年龄互动，代码如下： /// Ext.onReady(function(){ var person = new Ext.FormPanel({ baseCls:"x-plain", // style:"padding:5px", layout:"column", items:[{ columnWidth:...
4、Ext.Resizable Ext.Resizable实现浮动层可改变大小、可拖动，代码如下： /// Ext.onReady(function(){ var resizer = new Ext.Resizable('img-id', { //构造函数 wrap:true, pinned:true, minWidth:50, minHeight: 50, maxWidth: 500, maxHeight: 400, preserveRatio: true, dynamic:true, handles: 'all', // shorthand for 'n s e w...
3、Ext.Window 下面结合一个例子来讲解Ext.Window，上一节最后一个Ext.Panel完整登陆实例稍作改造，代码如下： /// Ext.onReady(function(){ var _window = new Ext.Window({ title:"窗口", layout:'form', width:260, height:130, labelWidth:45, resizable:false, //resizable：是否可以改变窗口大小 minimizable:true, ...
1、Ext.Button Button的创建new Ext.Button({...});，在HTML中Button有三种类型：submit、reset、button,在extjs是相同的，下面来看看extjs三种绑定事件的方法，例子代码如下： /// 第一种handler： //document.body == Ext.getBody().dom Ext.onReady(function(){ new Ext.Button({ renderTo:Ext.getBody(),//属性renderTo：将当前对象所生成的HTML对象存放到指定的对象中 text:"确 定", ha...
前面讲过实际应用中的弹出窗口，那里提到的只是一些默认的设置，实际中不满足用户需要，如窗口的背景色如何改变，窗口的内容如何控制等，前面讲到的例子代码如下： Ext.onReady(function(){ Ext.get("btn").on("click",function(){ var html="你好，志玲。"; newWin(html); }); }); function newWin(html) { var win=new Ext.Window({ title:"窗口", ...
