随笔分类 - ExtJS
摘要：表单Ext.form.FormPanel1、表单对于传统的b/s应用来说，数据录入元素是放在表单标签里面的。而对于ExtJS应用来说，则可以直接使用FormPanel控件来存放表单中的元素。FormPanel继承自Panel，在Panel的基础上提供与表单相关的各种特性，比如可以指定表单提交的url、指定表单提交方式、是否是二进制提交等；另外FormPanel固定使用form布局，前面关于布局一节中的内容我们说过，form布局也就是专门用于组织包含输入元素的布局。看下面的代码：运行效果如下：在上面的代码中，使用new Ext.form.FormPanel来创建表单面板，通过labelWidth
阅读全文
摘要：getDom方法能够得到文档中的DOM节点，该方法中包含一个参数，该参数可以是DOM节点的id、DOM节点对象或DOM节点对应的Ext元素(Element)等。 (与getElementById是一个效果)•Ext.onReady(function(){var e=new Ext.Element("hello");Ext.getDom("hello");Ext.getDom(e);Ext.getDom(e.dom);});•//Html页面中包含一个id为hello的div，代码如下：aaa•在上面的代码中，Ext.getDom("hello&
阅读全文
摘要：Ext.BoxComponent也是一个比较重要的基础类，它直接继承自Ext.Component，并实现了定位和控制自身大小的功能。可以使用pageX、pageY、x、y为Ext.BoxComponent指定具体的坐标，也使用width和height为Ext.BoxComponent指定长度和宽度，或者使用autoHeight和autoWidth让Ext.BoxComponent根据本身的内容自动调整长度和高度。 布局
阅读全文
摘要：Ext.QuickTips.init();Ext.form.Field.prototype.msgTarget = 'side';Ext表单提示方式：msgTarget:有4中方式：qtip,title,under,sideExt.onReady(function(){Ext.BLANK_IMAGE_URL="resources/images/default/s.gif";Ext.QuickTips.init();//初始化显示提示信息。没有它提示信息出不来。varform=newExt.form.FormPanel({title:"提示信息(si
阅读全文
摘要：在extJS的例子中，大部分都在程序第一行使用了如下语句：Ext.QuickTips.init();但是QuickTips的用处是什么呢？我们看一段最简单的代码： 04.form Link Link2 鼠标悬浮在链接上的效果如图：即：把鼠标移到上面的Link和旁边的输入框上方，可以看到在鼠标旁边显示出了提示语。 可以明显的看出Ext.QuickTips.init()的作用了吧，QuickTips的作用是读取标签中的ext:qtip属性，并为它赋予显示提示的...
阅读全文
摘要：在Ext开发过程中，基本上时刻需要用到异步请求，那么这个请求到底是怎么执行的呢，我们接下来来探讨下首先：Ext.Ajax类继承了Ext.data.Connection，为Ajax的请求提供了最大灵活性的操作方式再简单请求基础上我们加上一个使用的Ext.Ajax.request({ url:'findbyid.action', params:{ id:cell.getId() }, success: function(resp,opts) { var respText = Ext.util.JSON.decode(resp.responseText); name=respText
阅读全文
摘要：Viewport不需要再指定renderTo，而我们也看到Viewport确实填充了整个浏览器显示区域，并会随着浏览器显示区域大小的改变而改改。他有三个特点：1）、创建即可使用。不需要渲染，当组件在创建时会自动渲染到document.body节点。2）、不能使用程序改变该控件的大小，也没有滚动条。3）、只是作为容器组件，没有额外的属性、方法及事件 布局 窗口Window 我们来讲窗口Window控件，他可以用来表示应用程序中的一个窗口，在窗口中可以放置种种界面元素。窗口Ext.Window的父类是Ext.Panel，因此窗口其实是一种特殊的面板Panel。窗口包含了浮...
阅读全文
摘要：选项卡 tabs.jsExt.require('Ext.tab.*'); Ext.onReady(function(){ var currentItem; var tabs = Ext.createWidget('tabpanel', { renderTo: 'tab...
阅读全文
摘要：1. XML数据源假设我们有一个数据源是以XML的形式存在的，我们需要从里面取出数据并绑定在界面。XML的结构如下： 15 奥特曼 打小怪兽 13 孙悟空 吃桃子 100 石曼迪 睡觉 其绑定部分代码比上节的简单多了，最少不用定义数据源了，只需要告诉Ext要的数据在哪里去取即可，实现代码如：//解析数据源vards=newExt.data.Store({ url:'student.xml', reader:newExt.data.XmlReader({record:'stu'},[ {name:'age'},{name:'name'
阅读全文
摘要：表格控件其实也就是帮我们完成了数据的填充工作而已，具体的数据源、要显示的列，列的定制、数据源中的哪条数据显示在哪个列中等属性还是需要我们自己手动配置的，所以我们分下面几步来完成网格控件的数据绑定：1、定义表格： 定义一个表格比较简单，只需要new几个列即可，带上列的名称和要绑定的数据，定义列代码如：varcm=newExt.grid.ColumnModel([ {header:'编号',dataIndex:'id'}, {header:'性别',dataIndex:'sex'}, {header:'名称',data
阅读全文
摘要：面板 当然除了常用的这几个属性外，还有一大堆属性，这里以表格的形式列举出来，供大家查阅：Ext.Panel主要配置项目表表配置项参数类型说明animCollapseBoolean设置面板折叠或展开时是否显示动画效果，如果 Ext.Fx 类可用则默认为true，否则为fasle。applyToMixed一个页面上已经存在的元素或元素id，组件将会追加到该元素的后面，而不是将其作为新组件的容器。autoDestroyBoolean设置是否自动销毁从容器中移除的组件，默认为true，否则要手工销毁autoHeightBoolean是否使用自动高度，true则使用自...
阅读全文
摘要：选择确认对话框 带输入的确认对话框 带多行文本输入框的对话框 多个按钮选择的对话框 进度条对话框 选择确认对话框 传统对话框 alert confirm确认对话框 prompt输入对话框 Ext对话框 alert confirm确认对话框 prompt输入对话框 wait对话框 进度条对话框 自定义对话框 自定义对话框也可以定义对话框的图标，只需要加上：...
阅读全文
摘要：一、EXT是什么？1. Ext是一个Ajax框架，可以用来开发带有华丽外观的富客户端应用，使得我们的b/s应用更加具有活力及生命力，提高用户体验；2. Ext是一个用javascript编写，与后台技术无关的前端ajax框架。因此，可以把Ext用在.Net、Java、Php等各种开发语言开发的应用中；3. Ext是面向对象的；4. Ext没有你想象中的那么难；二、Ext从哪里获取？http://www.sencha.com/products/extjs/download从这里下载最新的正式版压缩包，我下的是3.4.0的。解压后有58M大小，里面包含了很多其他的文档。三、Ext环境怎么搭建？我们
阅读全文