黄灯桥的专栏

图片管理要在两个地方使用：一是标签页内的图片管理，一是文章内容编辑时嵌套到插入图片的窗口内。因而，将图片管理做成一个扩展比较方便。当然，做成MVC模式也行，不争论，不讨论。要记住，扩展要写在Scripts\ExtJS\Ux目录下，因为在路径的设置中，扩展目录是指向这里的。在该目录下创建一个名为PicManager.js的脚本文件。图片管理的主要界面分两部分，左边以树的形式列出文件目录，要实现目录的

原文地址：http://www.sencha.com/blog/mzpivotgrid-a-pivot-table-for-ext-js?mkt_tok=3RkMMJWWfF9wsRokvq3BZKXonjHpfsX77%2BsqWK%2B0lMI%2F0ER3fOvrPUfGjI4JSMZ0dvycMRAVFZl5nR9dFOOdfQ%3D%3D在mzSolutions，我的工作是为Ext JS

从上图面板中那条横线可以很清楚的看出树面板的容器没有使用Fit布局造成了树面板没有填满整个布局，而是根据自身大小进行显示。实际的代码：var mainAccirdion = new Ext.Panel({ id: "MainAccirdion", region: 'west', split: true, layout: 'accord

经常碰到有人问：事件中怎么获取某个对象？事件中的参数有什么用？我要某个数据，怎么在事件中获取？其实，要解决这个问题很简单，甚至不用看API，自己去分析一下就好了。要做分析，只要在事件的回调函数内加入以下语句：console.log(arguments);然后在Firebug中，就会把所有参数都列出来了。通过在DOM面板对这些对象进行分析，就能获得大部分需要的信息了。如果在这些参数中获取不到需要的对

下载地址：http://www.sencha.com/forum/showthread.php?261008-Ext-JS-4.2.1-Beta-1-Now-AvailableI am pleased to announce that Ext JS 4.2.1 Beta 1 is available for your testing and reviewing pleasure. We have

原文：Introducing Ext JS 4.2Ext JS 4.2包含了许多令人兴奋的增强功能和特性。你可能已经在之前的文章中阅读过相关的一些功能和特性了，如Grid组件改进。在这篇文章中，将介绍新的海王星主题和从右到左（RTL）的支持。海王星在Ext JS 4.2中，我们很高兴的欢迎海王星作为官方完全支持的主题来到了这个大家庭。终于可以构建具有现代感的应用程序了，具有现代特性的外观对于应用程

原文地址：http://www.sencha.com/blog/integrating-ext-js-with-3rd-party-libraries/作者：Kevin Kazmierczak Kevin Kazmierczak is a Senior Technical Architect at Universal Mind,

经常会有人问我，为什么我的Grid不能岁窗口的变得而自动调整。了解后，发现很多人都习惯在渲染子组件的时候将Gird渲染到容器内的一个div里，而这正是问题的所在。在Ext JS的布局系统中，能控制到的是容器的子组件，而对于渲染到容器中一个DIV的Grid，它并不知道在这容器里添加了一个Grid，当调整大小的时候，也就无法去调整Grid的大小了，而这也就是为什么Grid不会随容器的改变而改变了。为什

今天，有人请教我处理办法，问题是：一个Grid，选择某条记录后，单击编辑后，弹出编辑窗口（带编辑表单），编辑完成后单击保存按钮保存表单，并关闭窗口，刷新Grid。这，本来是很简单的，但囿于开发人员对Ext JS的理解不到位，搞得相当的复杂了。主要复杂的地方在以下几点：为了实现编辑表单的可重用，把表单做成了页面，然后在Window中套IFRAME打开页面。表单的提交不是用Ajax提交，而是使用习惯的

原文地址：http://www.sencha.com/blog/top-10-ext-js-development-practices-to-avoid/作者：Sean Lanktree Sean is an Ext JS Professional Services Lead at CNX Corporation.在CNX，尽管

地址：http://www.sencha.com/forum/showthread.php?132048-Ext.ux.container.ButtonSegment

Visual Studio 2012太强大了，居然能自己会去提取Ext JS的类的属性和方法，从而实现只能提示。下面就来介绍一下实现这个功能。在Visual Studio 2012中随便创建一个Web项目，我创建了一个空的Web项目，目录结构如下图所示：关键就是Scripts中的_references.js文件，文件的内容如下：/// 这个和VS2010中实现只能提示的原理一样。需要注意的是ext

很多人都会奇怪，为什么在Ext JS 4中会大量使用“var me=this”这样的写法，其实，在官方论坛以下地址的帖子已经给出了很好的说明：http://www.sencha.com/forum/showthread.php?132045帖子里提到的最主要原因是脚本的压缩问题，例如以下代码：function doA() { var me = this; me.a();

原文：Understanding HTML Helpers in ASP.NET MVC作者：Shailendra Chauhan works as Software Analyst at reputed MNC and has more than 5 years of hand over Microsoft .NET technologies. He is a .NET Consultant a

在Ext JS包示例目录的ux目录下有一个Ext.ux.GroupTabPanel组件，可实现左侧分组显示菜单。这个组件有个小问题，就是在第一次渲染的时候，会把所有标签页都渲染了。这对有很多标签页的应用程序很不利，第一渲染的时间成本太高。在Ext.ux.GroupTabPanel内部是使用卡片（Card）布局来实现标签页的切换的，但是作者在定义卡片布局的时候，并没有设置为可以延迟渲染，而是使用了默

原文地址：http://senchado.blogspot.com/2013/03/extjs-42-app-with-custom-neptune-based.html原文标题：ExtJS 4.2 app with custom Neptune-based theme using Cmd 3.1这是痛苦还是什么？今天，这已经是第三次尝试使用CMD来生成的Ext JS 4.1应用程序骨架了，终于成

链接地址：http://www.sencha.com/forum/showthread.php?137242

先来完成树目录的显示。开始前，现在解决方案中创建一个Upload目录用来存放上传的图片，为了便于测试，在Upload目录下随便添加两个目录，这里添加1和2。好，现在创建一个名为FolderController的控制器，添加必要的引用后，先添加一个字符串常量，用来表示根目录：stringroot = "../upload"; 在这里使用虚拟目录是因为可以结合提交数据直接转换为实际目录。这里要注意，当

现在要完成目录的编辑操作。因为目录的编辑只是改变目录名称，因而使用Cellediting插件就可完成工作。根据书11.3.2节的示例，要完成这个不难，首先在目录树的定义中加入以下语句隐藏列标题：hideHeaders:true, 接着添加plugins配置项来配置CellEditing插件。因为根目录是不运行编辑的，因而需要监听beforeedit事件，如果当前选择节点是根目录就返回false，不

今天来完成排序问题，这个在书中示例不少，不过，在这里啰嗦一下也是有好处的。要实现远程排序，首先要清楚的是排序信息是如何提交到服务器的，而这个，利用Firebug相当简单。在VS，切换到PicManager.js文件，找到filestore的定义，先将renmoteSort修改为true。然后添加sorters配置项，代码如下：sorters: [    { property:"modify" ,

上一篇已经完成了分类树的显示，现在开始逐步完成分类的添加、删除和编辑操作。首先要做的是在树面板上添加一个工具栏，放置添加、删除和编辑按钮。切换到文章管理视图的脚本文件view.js，在树的定义内，添加以下代码添加工具栏和按钮：tbar: [    { iconCls: "folder-add", scope:me, tooltip: '增加文章类别',id:"CategoryButtonAdd"}

文章管理涉及T_Category 、T_Content 、T_Tag 和T_TagInContent 这4个表，在客户端，由于标签的两个表的显示会合并到文章内容里，因而文章管理至少需要2个模型和2个Store，一个是分类的，一个是Content的。现在的问题是，文章管理界面左边的分类是以树形式显示的，是否需要用到一个完整的模型？完整的模型肯定是需要的，因为分类也要编辑、修改和新增。但树是否直接使用

有了编写用户管理的控制器的经验，写这个问题应该不大。不过，文章管理的控制器还是要考虑一下怎么写这个问题，因为在视图里涉及分类的操作和文章的操作。这确实是一个比较费神的事。在这里，问题的焦点就是需要不需要拆分的问题了。根据松耦合的原则，必然是拆分的，但是拆得太小，太凌乱，写代码是比较痛苦的，尤其是象Javascript这样灵活但结构不太严谨的语言。笔者开发大型系统经验不多，因而一向比较随心所欲，方便

文章管理的视图与文件管理区别不大，都是分左右两部分。文章管理的左边是树状的分类列表，右边以Grid形式显示的文章列表。基本上重复劳动比较多，使用Sencha Architect这个可视化工具来做这方面的设计，是不错的选择，如果公司收益好，强烈建议使用，一个开发包的价格是399美金，大约2800人民币，还是很划得来的，起码比请多个程序员划得来。废话又有点多了，转回正题，在Scripts\app\vi

要想让Combobox列表显示像树，只要按Ext JS树的形式组织显示文本就行了。因而先用Firebug分析一下Ext JS树的格式就可以了。在浏览器打开Ext JS示例中的Check Tree示例，依次展开Grocery List和Ebergy Foods节点，会看到图53的效果。图53 Check Tree示例的效果因为Combobox中返回的是一个完整的树，其节点全部是展开的，因而可以知道，

现在来完成分类的编辑操作。原来是想用模型加载数据的，但现在想想，用表单加载会方便些。切换到文章管理的控制器，添加onCategoryEdit方法，利用表单来加载数据，代码如下：onCategoryEdit:function () {    var me = this,        tree =me.view.down("treepanel"),        rs =tree.getSelect

在完成文章管理功能前，先来完成文章列表工作。文章列表，都是在文章分类选择后执行的，因而要从文章类别的选择入手，文章管理的控制器Content.js中，文章类别的选择方法已经有了，是onTreeSelect方法，现在要做的就是完成文章列表的功能。在这里有2种方式可供选择，一种是使用Store的filter方法来实现筛选，一种是利用Proxy的extraParams配置项来完成。第一种方法的好处是可以

现在来完成文章管理的编辑窗口。在开始之前，先去官方论坛一个名称为Ext.ux.form.TinyMCETextArea的扩展，地址是http://www.sencha.com/forum/showthread.php?198699。该扩展的作用是将TinyMCE封装为一个表单字段。TinyMCE则是一个所见即所得的HTML编辑器，相当好用的一个东西。下载解压缩后，把TinyMCETextArea.

链接：Ext JS MVC与java 开发简单的CMS后台管理系统

现在，图片管理就剩上传文件功能没有完成了。这需要用到swfupload，在《CMS之图片管理（1）》中有它的下载地址和加入项目的说明。使用swfupload最麻烦的地方是要有一个HTML元素让它嵌入加载Flash的HTML代码，而且这个HTML元素必须覆盖住Flash来实现功能，这个有点类似做单按钮的上传按钮。现在，先为swfupload生成一个HTML元素来实现它的功能。实现方法是在显示图片的视

原文：Understanding AJAX Helpers in ASP.NET MVC作者： Shailendra Chauhan works as Software Analyst at reputed MNC and has more than 5 years of hand over Microsoft .NET technologie