Ext
关注
分享
扫一扫
文章平均质量分 77
iteye_11428
这个作者很懒，什么都没留下…
展开
-
combobox初始值的问题
最近碰到一个问题,有一个combobox,下拉的选项是从服务器读取的,我想在修改操作的时候,能够根据值自动匹配 使用了setValue()方法, 现在的问题是,页面第一次进入的时候,文本框中显示的是 valueField的值,不是displayField中对应的文本. 但是以后的显示都是正常的(只要不重新刷新页面) 原因在一开头没有focus就return了 查了一下Comb...2009-01-07 15:05:31 · 813 阅读 · 0 评论 -
grid的继承类，构建方便的grid操作
在以往建立grid的时都要建立很多的辅助类，比如store，column和record等等。尤其当一个页面里面有多个grid的时候，这样会有很多的冗余代码。使页面加载很忙。因此自己找了相关的文件，写了一个grid的扩展类。使建立grid只需几行代码就可完成。以下为扩展文件。其扩展类的名字为Ext.ux.grid.SimpleGrid。文件名字为：Ext.ux.grid.SimpleGrid....原创 2009-01-09 13:13:22 · 205 阅读 · 0 评论 -
让ext项目步入对象化编程
对于一些刚刚接触javascript的人来说大部分都在使用面向过程型的编程方式。例如：在一个页面中有一个按钮，<input name='mybutton' type='button' value='click' />如果使用script对其操作，就要在这个按钮上添加一个onclick事件，在对应这个事件script实现。例如：function myOnclick(){ al...原创 2009-01-09 13:39:51 · 138 阅读 · 0 评论 -
支持手写输入及联想功能的下拉框
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head><title> New Document </title><link rel="stylesheet" type="text/css" hre原创 2009-01-09 13:42:50 · 346 阅读 · 0 评论 -
树形下拉框
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html> <head> <title> New Document </title> <link rel="stylesheet" type="text/css"原创 2009-01-09 13:43:12 · 335 阅读 · 0 评论 -
带分页的表格
主要介绍如何使用ext的表格控件实现ajax分页。 上一节讲了ext的普通表格，当然ext表格最强的还是利用ajax分页，这里要加上服务端的代码了，本实例采用fleaphp框架演示，列出控制器的相关代码： /** * 留言列表 */ function actionList() { $modelBO = & FLEA::getSingl...原创 2009-01-09 13:43:31 · 213 阅读 · 0 评论 -
带搜索功能的grid分页实例
本实例将在带分页的表格基础上进行扩展，增加搜索功能。由于本实例采用fleaphp+ext制作，故本实例将只贴出核心的代码，不提供源码打包下载了（见谅）。部分参考自志凡的extjs grid搜索分页实例。下面先看下服务端的核心代码，这里采用PHP： /** * 留言列表 */ function actionList() { $modelBO ...原创 2009-01-09 13:43:50 · 244 阅读 · 0 评论 -
EXT 二级联动下拉列表
page.html代码如下<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <title>省份和城市二级联动例子</title>2009-01-14 14:57:28 · 139 阅读 · 0 评论 -
带右键菜单的树
ext树形菜单加上右键菜单是不是很酷，ext当然也能实现。 树形菜单如果加上右键事件是不是更接近C/S软件的效果呢？ext当然能够做到，看下面的代码： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html> <head> <title> New Docu...原创 2009-01-14 14:58:02 · 171 阅读 · 0 评论 -
直接在页面上显示富文本编辑器
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>直接在页面上显示富文本辑器</title> <link rel="stylesheet" typ原创 2009-01-14 14:58:21 · 1475 阅读 · 0 评论 -
Ext.ux.TabCloseMenu插件的使用
tab在ext里很常用，在点开N个tab后，是否能通过右键菜单，关闭全部tab或关闭除此以外的全部tab，当然可以，使用Ext.ux.TabCloseMenu插件就可以轻松实现。Ext.onReady(function(){ //tab插件 Ext.ux.TabCloseMenu = function(){ var tabs, menu, ctxItem; ...原创 2009-01-14 14:59:46 · 373 阅读 · 0 评论 -
巧妙运用NumberField
巧妙运用NumberField:只允许字段输入数字. var schedule=new Ext.form.NumberField({ fieldLabel: 'Schedule', name: 'schedule', decimalPrecision :0, allowBlank:false, width:60});只允许字段100以内的数字. ...2009-01-14 15:02:19 · 476 阅读 · 0 评论 -
使用百分比设置GridPannel宽度的方法
使用过Ext的Gird(网格)功能的人都知道它的功能非常强大。也遇到过当需要将GridPanel的宽度设置为100%的时候（width:100%），这样grid的宽度变得很长，根本就不是百分百。查找了一下资料，发现用 bodyStyle:'width:100%' 来设置百分比就可以实现我们想要的效果。但当我们把浏览器窗口缩小后，GridPanel的最右边被截了一部分。其实这个也很简单，...原创 2009-01-14 15:03:08 · 820 阅读 · 0 评论 -
Ext.Ajax
其实Ext.Ajax的使用并不难，只是当初我一直不清楚如何获取其返回值，搞得郁闷了一阵子，以下是一个比较简单的例子 1Ext.Ajax.request({ 2 url: 'Register.aspx', 3 params: { 4 oper: 'login', 5...2009-02-27 22:12:19 · 138 阅读 · 0 评论 -
Ext中的动画处理
CartoonExt.js//图片宽var WIDTH=300;//图片高var HEIGHT=262;function reset() ...{ //以Ext获得指定元素，并指定此元素左边距、上方边距、右边距、下方边距 Ext.get('target').highlight().setBounds(10,10,WIDTH+10,HEIGHT+10);} funct...原创 2009-02-27 22:13:43 · 163 阅读 · 0 评论 -
ExtJs中解决IE的min-width问题
当使用了ExtJs后，脚本documentElement.clientWidth得到的值是0，需要换成Ext.getBody().getWidth()来获得。 关于解决IE的min-width方法就可以这样写： //===========Style===============// #hxcy{ text-align:right;margin:0 auto; min-width:778px...原创 2009-02-27 22:14:16 · 148 阅读 · 0 评论 -
带复选框(checkbox)的树
该例子可以满足我们的一般需求。很多时候我们需要用到带checkbox的树。其实加个checkbox框先简单，只需要在返回来的json数据中加上 checked 项（为true/false）。要实现我们想要的选中父节点的checkbox后，自动选中子节点也很简单，只需要加上下面这一段代码就可以了。tree.on('checkchange', function(node, checked) {...原创 2009-03-20 15:05:33 · 175 阅读 · 0 评论 -
ext异步加载树的子节点
<script> Ext.onReady(function(){ var root=new Ext.tree.AsyncTreeNode({ id:'0', text:'所有分类' }); var data=new Ext.tree...原创 2009-01-09 13:12:54 · 221 阅读 · 0 评论 -
可拖拽的tree实际应用
ext提供的树本身就有拖拽的功能，也许大部分使用过TreePanel的都知道。可是光是在前台拖来拖去那是空把式不是吗？因此必须获取拖拽的事件才能与后台交互。因此现在就说一下如何获取tree的拖拽事件。对于要想让tree可以拖拽，那么必须为tree的enableDD属性设置为true。其实事件最常用的就是nodedrop。eg：tree.on('nodedrop',function(){ …...原创 2009-01-09 12:54:39 · 421 阅读 · 0 评论 -
Ext文件上传(使用swfupload插件)
其实Ext.form.TextField就是Ext的上传组件的，只要将其配置参数inputType设置为"file"就行了。上传文件除了文件输入框，还有一个重要的设置，就是需要将form的enctype属性设置为"multipart/form-data"。这个也很简单，在定义FormPanel的时候加入BasicForm的配置参数fileUpload，并设置为true就行了。在Ext中使用标准...原创 2009-01-07 15:11:10 · 313 阅读 · 0 评论 -
Ext中文乱码和中文显示问题
1、前后台所有文件统一用utf-8编码方式。2、在Request Headers中设置Content-Type：application/x-www-form-urlencoded; charset=utf-8，具体方法：将Ext.lib.Ajax.defaultPostHeader += '; charset=utf-8'加在Ext.onReady块里,此方法可以解决用EXT在POST时的中文...2009-01-07 15:20:07 · 269 阅读 · 0 评论 -
用Extjs做登录
index.html<div id="north-div"><a id="login" href="#">Login</a></div>login.jsExt.onReady(function() { Ext.BLANK_IMAGE_URL = '../../ext/resources/images/default/s2009-01-07 15:23:54 · 158 阅读 · 0 评论 -
Ext常见的几种校验方式
校验textfield一般来说有这几个常见的方式：1.不能为空 allowBlank:false2.最大最小长度 minLength: 10, maxLength: 100,3.邮件格式 vtype: "email",4.url格式 vtype: "url",5.密码输入两次，这个比较复杂，所幸的是extjs里的例子有的 //注册校验器 ...2009-01-09 11:23:48 · 545 阅读 · 0 评论 -
Ext验证码例子
login.js Ext.form.Myimg = Ext.extend(Ext.BoxComponent, { onRender : function(ct, position){ if(!this.el){ this.el = document.createElement('img'); ...2009-01-09 11:28:49 · 220 阅读 · 0 评论 -
Ext中form里面的全部控件的演示！
Ext.onReady(function(){Ext.QuickTips.init(); var arr=[ [1, '本.拉登'], [2, '笨.拉登'],[3, '笨.拉灯'] ]; var reader = new Ext.data.ArrayReader( {id: 0}, [ {name: 'value'}, {name...原创 2009-01-09 11:29:21 · 117 阅读 · 0 评论 -
用ExtJS实现动态载入树
Oracle DDL脚本 ：create table ORGANIZATION( ORGID NUMBER(10) not null, PARENTID NUMBER(10) not null, ORGNAME VARCHAR2(32) not null, ISAVAILABLE NUMBER(1) default 1 not null)...原创 2009-01-09 11:29:50 · 132 阅读 · 0 评论 -
使用Ext的Grid,Form,Dialog来实现分页列表,创建,修改,删除功能
在WEB 应用中,大部分的页面都可以被分为:列表,创建,读取,更新,删除.在Ext的文档中心提供了一个非常好的例子,一个行内编辑的表格.然而,在现实中,行 内编辑的表格是远远不够的,还需要用不同的方式来展示表单.下面的例子中向你展示如何在表格中创建/更新一个对话框表单.列表功能首先是是一个权限列表页,它包含分页,查询/过滤功能,创建和删除功能.先定义数据源:this.ds = ne...2009-01-09 11:30:40 · 144 阅读 · 0 评论 -
ext.grid.EditorGridPanel向后台传送数据
html 页面<html> <head> <title>测试数据</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description&q2009-01-09 11:31:03 · 161 阅读 · 0 评论 -
ExtJS与状态保存
在我这个例子中，我将会记住tab面板显示的tab。由于这是常见的情形，我就扩展TabPanel定义一个新类：Javascript代码 Ext.ux.StatefulTabPanel = Ext.extend(Ext.TabPanel, { stateEvents: ['tabchange'], getState: function() {return{tab:this.get...原创 2009-01-09 11:53:12 · 210 阅读 · 0 评论 -
extjs表单的非ajax提交方式
extEXT提交服务器的三种方式(转)EXT表单的非ajax提交使用extJs 2.0的form提交表单（非AJAX方式） [转]-----------------------------------------------------------------------HTML页面---------------------------------------------------...原创 2009-01-09 11:58:59 · 169 阅读 · 0 评论 -
用ExtJs为表格单元格增加Tooltips浮动信息
ExtJs证实了其十分强大的界面定制能力，其中的提供的ToolTips功能比HTML里的如下语句定制性更强，完全可以代替如下功能<a href="http://dfdfd" title="TIPS">Some Text</a> ExtJs是通过Ext.ToolTip和Ext.QuickTips两个组件来实现浮动提示功能的，其中Ext.ToolTip的定制功能很强，...原创 2009-01-09 12:02:05 · 186 阅读 · 0 评论 -
Ext gridPanel宽度100%时width:100000 BUG解决
bodyStyle:'width:100%',autoWidth:true,淘汰的方法有下面二种实现：不知是Ext的Bug还是其他原因，当初始化grid并将宽度设为100%时，其宽度会变成10000px宽，高度100%则grid高度根据grid内容自适应，而不是根据其所在容器自适应，一直没有很好的办法，只能使用绝对宽高，但有时这是很不方便的。对此问题一直耿耿于怀，后来终于想出了一个办法...原创 2009-01-09 12:02:26 · 419 阅读 · 0 评论 -
ColumnLayout的使用方法
CoulumnLayout是经常用到的布局类型，但也是让人感到迷惑的布局。主要原因是同一效果的定义方法有多种。笔者在早期的一篇博文虽然也做过讲解，但是因为例子写的是简洁的写法，反而没把问题说清楚，实在深感抱歉。总体上说要达到同一效果，CoulumnLayout的定义方法有以下4种：■ 一行定义一个CoulumnLayout，每列中只有一个控件■ 只定义一个Coulu...原创 2009-01-09 12:02:51 · 718 阅读 · 0 评论 -
Checkbox与RadioGroup的使用方法
Ext提供的Checkbox与Radio，在控件同名成组时，例如将性别的男与女两个Radio控件都使用sex作为名称时，findField方法只能获取第一个控件，setValue也只能设置第一个控件，这样就造成了如果要使用Form的Load方式加载编辑数据或者用SetValues加载编辑数据时出现问题。要解决这个问题，第一种方法是定义名称不同的控件；第二种方法是控件名称相同，在加载编辑数据时手动处...原创 2009-01-09 12:03:26 · 195 阅读 · 0 评论 -
可直接编辑节点的tree
其实代码并不是很复杂，只是在原有的树形添加一个TreeEditor就可以了。代码如下由于我一向热衷于面向对象的编程方式，所以我提供的代码也是面向对象型的编程，如有不明白可以发问。先贴js文件：上面有代码提示//节点可以编辑的树Ext.namespace('demo');demo = function(){ this.init();//初始化函数 };Ext.exte...原创 2009-01-09 12:03:58 · 333 阅读 · 0 评论 -
extjs+air开发
一、准备工作 1、下载adobe air install和adobe air sdk,下载地址:http://www.adobe.com/cn/products/air/ 2、下载aptana，下载地址：www.aptana.com/ 3、更新aptana以便aptana支持adobe air 更新方法:help->aptana help->my aptana->plugi...2009-06-24 21:41:50 · 162 阅读 · 0 评论