先介绍个最简单例子 //html代码div id="win" class="x-hidden">        /div> //js代码var w=new Ext.Window({           contentEl:"win",//主体显示的html元素，也可以写为el:"win"           width:300,           height:200,       

添加记录篇里实现在分页栏里添加一个按钮,当点该按钮后弹出一个添加窗体,正确输入数据并提交成功后,窗体并不关闭(可以自己定义),但窗体下面的grid列表会自动增加刚刚添加的数据,视觉效果非常理想.首先看看效果图.在这个效果图里面不仅仅设置了添加按钮,而且还添加了一个刷新按钮在上面的效果图里面的分页栏里可以看见,已经将按钮添加到分页栏里面,Ext2.2以前的版本只能够将按钮添加到工具栏,当然也不是说一

只所以把这个作为系列之一，主要的就是说明如何获取数据以及在点编辑按钮时,如何将数据动态绑定到窗体对应的字段里面在获取记录时首先需要选中某条数据前面的复选框，否则会有有自定义的消息提示你如何正确的操作.下面来看看两则效果图,和上篇的样式一样,只是功能不一样而已,同样数据的来源和后代代码的实现都是一样的,也包含了如何获取数据和验证数据以及与后台传递数据的方式,仅仅没有在服务器端实现编辑的功能,事实上这

大家都知道，刚开始搞extjs的时候，很是有点困难，所以本人在新手刚入门后准备了这个系列的文章。个人认为用extjs做后台很不错，布局比较完美！1.Ext.MessageBox.alert()方法      有四个参数，为简单起见，主要介绍前面三个参数：      alert( title , msg , function(){} )      其中title，msg为必选参数，function为

 上篇中我们简单的谈到了FormPanel中的fieldset和ComboBox,今天我们继续把这个话题说下去，说全一点，说深一点。3.可选的fieldset实例   其实就是带个chechbox，有点像论坛注册时有一部分是选填信息的那种效果，主要知识点：//因为觉得这个参数特别，特举一例以说明1.checkboxToggle:true//true则呈现一个带checkbox的fields

大家好,接着介绍extjs的基础吧,Tabpanel组件大家喜欢吧!(暂放首页2个小时.)照旧,看个最简单的先,后面再详细说复杂的!效果图片:js代码:Ext.onReady(function(){     var tabsDemo=new Ext.TabPanel({            renderTo:Ext.getBody(),            width:300,      

XTemplate是Extjs里面的模板组件.下面我们看个最简单的例子.效果图:js代码:Ext.onReady(function(){    //数据源    var data={       name:"博客园",       read:[{           book:>,           date:2007-7-7       },{           book:">"

extjs的默认皮肤很好看,但是我们还可以变换样式切换其他皮肤.1.直接添加其他css文件换肤.皮肤文件:xtheme-olive.zip下载把皮肤文件解压,把css文件(如xtheme-olive.css)拷贝到extjs的resources目录下css文件夹里面:解压皮肤文件,把里面的相应的 image文件夹下的目录(比如olive)拷贝到extjs的resources目录下ima

在这篇文章里介绍了如何将grid扩展行，通常在很多的新闻网站，你只能够看见标题信息，或者看到的将内容信息截取的，无论哪样，你都无法一目了然的浏览详细内容，除非你打开新的页面。这里向大家介绍了Ext自带扩展grid行所实现的惊人的效果。实现功能就是在行的前面定义了一个加号，当点这个加号时就会在紧接当前行的下方显示你定义的任何信息，特别是详细信息。效果非常精美绝伦。先看看效果图吧上面是grid列表显示

N久没有写extjs的，作为一个新手，我为我的这种懒惰行为感到惭愧！鉴于有朋友反应前面的文章过于简单，我决定以后的文章如果没有闪光点就放在新手区(如果不适合，请跟帖)，不放在首页！11.checkbox简单示例效果图：js代码：Ext.onReady(function(){  Ext.QuickTips.init();  var myform=new Ext.FormPanel({  

下面先看看效果图吧上面的效果可以说明是在数据浏览篇的基础上扩展而来,虽然仅仅是增加了几个按钮,但是当初并没有想到这方面,只是刚刚才有了这个想法在选中某条记录后就可以对当前的这条数据进行编辑了,当然,你还可以增加新的记录, 你还可以根据需要增加更多的操作按钮这里具体的操作功能都没有实现,主要是因为前几篇可以借鉴.下面就看看选中某条记录后的效果吧感觉还是很漂亮的.下面把页面设计代码完整张贴出来.

批量删除篇主要介绍如何获取批量删除所需要的数据以及将一个实现批量删除的存储过程贴出来供大家讨论.本例子实现了客户端获取以及存储ID数据的方式,在从服务器端返回后也做了假设性的处理.这里不需要再弹出一个窗体来确认批量删除,但是还是需要一个确认的消息框的,如果选择删除才会执行删除的处理语句.先看看图片吧通过上面这幅效果图可以看见在分页栏里面已经将批量删除按钮放置进去,在没有选中任何数据的时候点批量删除

这篇实现的功能是:当选择grid列表的某行数据时,在列表的右边则会动态的显示该条数据的详细信息.先看看效果图:上面的效果图展示了当选择左边列表的某行数据时,在右边就会动态的显示该条数据的详细信息当我们选择某行数据后就会出现下图所示的效果: 上边的效果图显示了这个功能的实现.下面将页面实现代码完整张贴出来:[复制到剪贴板]CODE:    Ext2.2全新功能版系列之--显示详细内容

在上篇和前面的介绍中，我们基本上对form表单中常见组件有了简单的认识，今天我们做个综合点的例子，向服务器提交下！其实这篇文章很简单，没有什么发光点，暂放首页半天,忘各位理解！先来个简单的例子，以说明formpanel如何把数据传给其他页面。效果图：现在我们要实现的效果是：点击确定，把值传到另一页面！，如下：原页面js代码为：Ext.onReady(function(){  Ext.Quick

面我们要介绍的是，如何动态的添加标签页！ 2.动态添加tabpanel的标签页效果图:点击"添加新标签页",会添加一个标签页,而且激活这个新的标签页.html代码:body style="margin:10px;">    div>    a id="AddNewTab" href="javascript:void(0)">添加新标签页a>    div>body>js代码:Ext.o

今天开始,我们就开始一起学习TreePanel了，道个歉，上篇的代码很乱阿.我总是喜欢用最简单的例子开始,去理解最基本的使用方法,减少对i后面高级使用的干扰!TreePanel是继承自Panel,所以很多在Panel中谈到的属性这里可能会一笔带过,如有问题,请参考ExtJs2.0学习系列(2)--Ext.Panel 1.第一个静态树--最简单的树效果图:html代码:div id="conta

昨天有朋友说,在IE下有的时候ashx传过来的节点不能加载,其实我也出现这样的问题,很是烦人!今天extjs上看到了一个解决方案，觉得很好:如果treeLoader加载失败，会继续加载，直到成功加载。4.解决IE下非正常加载节点问题即使从服务器取到大量的数据，也没有问题。．．．．．．基本代码一样，只有js代码的loader小小的修改下： loader:new Ext.tree.TreeLoad

只所以把这个作为系列之一，主要的就是说明如何获取数据以及在点编辑按钮时,如何将数据动态绑定到窗体对应的字段里面在获取记录时首先需要选中某条数据前面的复选框，否则会有有自定义的消息提示你如何正确的操作.下面来看看两则效果图,和上篇的样式一样,只是功能不一样而已,同样数据的来源和后代代码的实现都是一样的,也包含了如何获取数据和验证数据以及与后台传递数据的方式,仅仅没有在服务器端实现编辑的功能,事实上这

确定删除篇和编辑修改ext的实现上基本上一样的,不一样的是在后台的逻辑处理方式上.在本章将前两篇的编辑修改功能和添加功能都添加进来,这样就逐步实现了grid操作的完整性.下面先把效果图展示出来:由上图可以看出在分页栏基本上实现了grid操作的完整性上面的效果图显示了没有选择记录时弹出的提示消息.上面这幅效果图展示了在选择数据后弹出的一个确认删除的窗口全部代码如下:[复制到剪贴板]COD

下面先看看效果图吧上面的效果可以说明是在数据浏览篇的基础上扩展而来,虽然仅仅是增加了几个按钮,但是当初并没有想到这方面,只是刚刚才有了这个想法在选中某条记录后就可以对当前的这条数据进行编辑了,当然,你还可以增加新的记录, 你还可以根据需要增加更多的操作按钮这里具体的操作功能都没有实现,主要是因为前几篇可以借鉴.下面就看看选中某条记录后的效果吧感觉还是很漂亮的.下面把页面设计代码完整张贴出来.

 今天介绍extjs中的Panel组件。 //html代码div id="container">    /div> //js代码var p = new Ext.Panel({        title: My Panel,//标题        collapsible:true,//右上角上的那个收缩按钮，设为false则不显示        renderTo: containe

篇中我们讨论了Ext.window的简单使用，今天我们要看看强大的FormPanel,也是继承panel组件的使用。首先弄清楚这个问题，创建的时候： //查看源代码便知，两种方法是一样的Ext.form.FormPanel = Ext.FormPanel;我们还是从最简单的代码实例开始吧：html代码-->body>div id="form1">div>body> //js代码

 前言：说句实话，此extjs系列的文章在博客园中的热度不高，可能是学这玩意的人不多吧，但是我觉得有这么个系列的文章对于中国朋友非常有帮助！请大家支持！上篇ExtJs2.0学习系列(5)--Ext.FormPanel之第二式中我们讨论了下fieldset和表单验证的知识，今天我们接着深入解析表单元素中ComboBox组件的使用。会涉及到.net简单服务器数据交互，但暂不做深入讨论，以后会详细分析服

在这个显示篇里,简单的从后台绑定数据,包括分页和刷新的功能.源代码下载先看看图片展示的效果:Ext实现[复制到剪贴板]CODE:    无标题页                                        function ready()    {        var url = "jsonGrid.aspx?Param=select";        var