1.1 学习技能点 本次在线学习将学习以下知识技能： Ø 柱状图 Ø 饼状图 Ø 折线图 1.2 学习任务 ExtJS3使用的Flash Chart来源于YUI，其中包括柱状图、饼状图等多种图表，这些图表可以与...ExtJS组件完美整合，不仅可以在Panel中显示图表，还可以通过Store为图表提供数据。...1.2.2 任务2：使用折线图统计每月的访问人数 需求说明 使用折线图统计每月的访问人数，效果如图6.1.2所示。...图7.1.1 使用ExtJS开发RIA应用知识 2.2 综合实训 2.2.1 任务描述 本次综合实训任务是使用ExtJS作为前端RIA框架，后台技术使用SSH实现一个学生管理系统。...图7.1.4 学生信息修改界面 双击Grid中的一行数据，将使用RowEditor进行编辑学生信息，效果如图7.1.5所示。
Ext.Ajax.request和formPanel.getForm().submit()两种提交方法的异同： 1、 相同点： a) 都是使用异步提交的方式； b) 默认都是使用POST方式来提交数据；...2、 不同点： a) Request方法不可以使用waitMsg属性来设置在等待响应过程中显示的信息，而submit方法提交时这个设置是可用的(可以看到效果,而前面说的不可用是指设置了看不到效果)；...），第二个参数是提交的参数对象，一般不需要用到，如果要读取返回的响应信息，要先用Ext.decode方法将其resonseText属性值转换成json对象才可以读取；如服务器端返回的是一个json格式的字符串...如果不经判断就访问，有可能会引发异常； d) Request方法提交后，无论返回的json结果中success属性是否为true，回调函数都会到success:function()里面执行，所以在这种情况下...方法在返回的结果中，如果success为true的，就会自动执行success：function，如果是false,则会执行failure:function了，所以没有必要再在里面判断success是true
1、模块的操作权限：包含可浏览，增改删，附件的CRUD操作，审核。审批，附加功能的操作（这个前面忘了介绍了，在以下会介绍一下）。...一、模块的操作权限：在前面的模块设计过程中已经有了此权限的介绍。一个模块增加系统后，须要在角色中设置此模块的权限。...下面即为还有一系统的一个权限设置界面： 可浏览假设没有选中。表示该操作员不能查看此模块。 反应在前台就是在菜单项里没有该模块的菜单。 可新增。...以下来看看截图： 以下来看看附加功能是怎样加进去的。在系统的管理模块中，有一个模块附加功能的管理模块。该模块定义了全部的系统中使用到的附加功能，包含系统模块使用到的。...，前台会由extjs mvc来捕获菜单点击事件来运行。
id系统会默认给其id 注释// id:'tt' 比较就明白了 ?...说明： 必须返回json的格式切要有success,类似这样的： ("{success:true,info:'1001111111111111111111111!'}")...method=login', method : 'post', // 如果有表单以外的其它参数，可以加在这里。...store设置了url属性，可重新指定url的参数: store.load({params:{a:1, b:2}}); //如果store的内容只是普通的数组： store.loadData...([...]); //如果store没有单独的变量定义，可以用 comboBox.initialConfig.store //或 Ext.getCmp('comboId').initialConfig.store
至少带智能提示的xml配置怎么也要比写js要顺手方便多了。而且其还是免费开源的。不过在使用过程中，也没有那么顺畅。 1）TextField的LabelStyle属性无效。...} 如果监控ExtJS生成的html，就会发现，表单字段都会用到这个样式。...而我在Ext.NET里面是动态添加CheckBox（在Page_Load事件中添加），查看源码，根据生成的js配置，是在checkboxGroup的items属性里面"new Ext.form.Checkbox...不过值得注意的是，在给ExtJS表单控件赋值时，不要使用属性（text、value）赋值，这样只会将值写入到html控件里面，而ExtJS提交数据时不会提交，而应该采用其setValue方法。...这招固然能解决问题，但是我心里总是觉得有原因的，可是没时间耗着。好在随着测试，终于找出了问题所在。即FormPanel控件不推荐使用Content元素布局，如果使用Items布局就不存在该问题了。
，默认情况下linq to sql设计器生成的T_Class类里，是不支持序列化的，ExtJs调用时无法正确序列成JSON字符串，需要手动在类前加上数据契约 [DataContract]，在属性前加上[...目的是为了生成Restful WCF，可以在ExtJs里用类似"MyService.svc/GetClsData"这样的url来访问 b.Extjs调用的前端页面 中，否则网格上右击，设置显示列时，报JS错误，原因不明。...，必须是id对应的列，否则出错 4.服务端的类中，如果有DateTime字符的字段，需要手动修改dbml对应的cs文件，把DateTime改成string，否则序列化时，会产生很怪的值，估计是.Net...在序列化成JSON时的bug. 5.为了减少生成的JSON字符串的大小，可以仅在需要输出的类属性上标记[DataMember]，这样在生成的JSON字符串，不会包含未标记为[DataMember]的字段
个人认为，XTemplate是ExtJs中最灵活的用来显示数据的组件，有点类似aspx中的Repeater控件，显示数据的模板完全可以由用户以html方式来定制....先给一个官方的静态示例(稍微改了下)，代码并不复杂，关键的地方，我已经注释了 Ext.onReady(function()...', //表明这里循环读取drinks节的数据,当数据没有属性名称时，用"."...的Ajax对象，请求MyServices.svc/GetPerson方法，获取Json字符串，其它地方完全一样，需要注意的是: a.返回的字符串，需要用Ext.Util.JSON.decode转换成JSON...对象 b.为了显示出loading加载效果，在调用Ajax的Request之前，用demo.com.innerHTML和demo.com.className先把目标div设置成"加载中"的字样 运行效果如下
ExtJs是一套非常不错的javascript UI库(第一次接触ExtJs的，可到官方网站http://www.extjs.com/deploy/dev/examples/samples.html看下示例...相信不少人会心动的)，不仅组件丰富，效果漂亮，而且ExtJs集成的Ajax功能可以方便的与.Net的WCF进行交互....这里我们将演示ExtJs的FormPanel从WCF加载数据，以及如何提交数据到WCF服务端 1.首先来定义一个用于传输信息的Class（实际开发中，可以是Linq to Sql的Class或任何可序列化的实体类..." }, //这里为了演示用，随便给出几个值，实际开发时，可将测试值改为用Ext.get("id").dom.value之类 ，如果提交成功，将从服务器返回处理结果...的Ajax对象完成与WCF的交互(初次接触ExtJs Ajax的，可参见ExtJs学习笔记(5)_Ajax示例https://cloud.tencent.com/developer/article/1026518
•build ：压缩后的ext全部源码(里面分类存放)。 •docs ： API帮助文档。 •exmaples：提供使用ExtJs技术做出的小实例。...这是Ext提供浏览器兼容性的一种主要方式。 如果没有这个，会默认从远程extjs.com下载。 ?...•getCmp方法用来获得一个Ext组件，也就是一个已经在页面中初始化了的Component或其子类的对象，getCmp方法中只有一个参数，也就是组件的id。...它可以被用来校验和约束用户的输入，并且抛出错误的信息。...菜单的所有itmes可以组合起来形成一些列可选择的按钮 xtype: 'tbsplit',分割菜单 就是按钮和菜单的结合。在使用它的时候只要在menu配置项目中添加按钮的属性就可以了。
模型工作起来很香ExtJS 3中的Record类，而且一般同Stores一起用来在表格（grid）和组件中展示数据。 2 视图表示任何类型的组件 - 表格、树，还有面板等都是视图。...这就会告诉应用程序自动加载那个文件，以便我们在启动时使用到它。引用程序使用 ExtJS 4 的新的动态加载系统去自动的把这个文件从服务器推出来。下面是现在当我们刷新页面时所看到的： ?...现在我们仅仅只在存储上定义了内置的域（‘name’和‘email’）。这样工作得很好，但是在 ExtJS 4中我们会乐于去利用强大的 Ext.data.Model 类，当需要编辑我们的Users时。...我们可以使用updateUser方法在我们点击保存按钮时被调用来满足我们的需求： ?...代理（Proxies）是ExtJS 4 中从存储和模型中加载和保存数据的方法。其中有AJAX，JSON-P和HTML5本地存储代理。
这几天在学习ExtJs + Wcf的过程中，发现一个问题，如果Class中有成员的类型为DateTime，即使我们正常标识了[DataMember]，序列化成JSON时，会生成一种特有的格式: .....这种格式ExtJs并不识别，导致最终的组件，比如Grid上无法正常显示，解决办法有二个: 1.将Class的成员，手动改成String类型，不过个人不推荐这种方式，毕竟将数据类型都改了，相应的服务端很多地方都可能会做相关修改...2.用JS在前台调用时，用代码处理返回的JSON字符串格式，使之符合ExtJs的规范(这个方法是从博客园"小庄"那里学来的，呵) Ext.onReady(function() { //这个函数演示了怎样把服务器端的...DateTime类型转为Javascript的日期 function setAddTime(value, p, record) { var jsondate...设置Grid的Columns时，类似如下处理: var grid = new Ext.grid.GridPanel({ store: store,
动态加载 ExtJS 类库 ExtJS 是一个非常优秀的 JS 框架， 由于 ExtJS 自身非常庞大， 用于开发测试的 ext-all-debug.js 文件达到了 3.24M ， 如果是再加载带注释的...配置 Ext.Loader 启用动态加载 ExtJS 中的动态加载是由 Ext.Loader 来完成的， 默认不启用动态加载， 所以接下来需要做的事配置 Ext.Loader 启用动态加载， 在上面模板的...', initComponent: function() { this.callParent(); } }); 然后再 Ext.Loader 的配置中添加一条路径...win = Ext.create('App.testWindow'); win.show(); } 现在， 刷新一下浏览器， 能看到 Create Window 测试按钮， 在浏览器看到的情形如下图所示...结论 从上面的测试可以看出， 动态加载 ExtJS 是可以的， 但是文件有点儿多， 仅仅创建一个简单的窗口就需要加载 100 多个文件， 所以最终的建议是将所需要的 ExtJS 组件单独编译成一个文件或者直接使用
重要的是，用这个序列化后的DateTime字符串，ExtJs能够识别（注:百度搜索一下"Newtonsoft.Json"很容易就能找到N多下载的，下载后直接添加到项目引用里即可) 3.编写具体的实体类...这里为什么要加Json返回格式，原因很简单，不指定Json格式，默认就是以xml返回的，会无端在前后加上更多无用字符 5.ExtJs前端完整代码: Code <...(data) tpl.overwrite("BBS", data); //其实下面这四句在本例中没什么大的作用...这里已经成功序列化了，但是wcf的服务在返回时，必须要有一种格式，要么xml，要么json，所以我们指定了wcf以json格式返回后，会对正常的结果再做一次序列化，最后的结果是使字符串前后都加上了双引号...，也要留意一下，不能写在其它地方:比如Ajax请求之后，因为当Ajax还未成功返回数据/XTemplate未成功更新时，分页按钮以及链接还没有加载到页面中，这时如果用Ext.get()取对象，Js会报错
好了，闲话少叙，切入正题，Extjs前端框架是比较早的前端mvc框架了，可能很多人都没接触过，而且现在也很少有项目用Extjs框架搭建了，原因是什么？...那就不得而知了，有人说是Extjs比较重…… 在使用Extjs3.3及以下的版本，在IE10环境中却无法点击树节点，而在IE的其他版本（IE7，IE8，IE9,IE11）均可正常。...经过在网上查找资料得知，原因是因为Extjs3.3的ext-all.js中的getAttribute方法不能兼容IE10出错引起。...以下是Extjs3.3的ext-all.js的getAttribute方法 etAttribute : Ext.isIE ?...3.3的ext-all.js中，ie10中tree恢复正常。
当ASP.NET后台使用JavaScriptSerializer这个组件将对象序列化为json，或者使用ScriptMethod特性的json [ScriptMethod(ResponseFormat...json格式是这样的//Date(1213718400000+0800)// 这种格式ExtJs不识别，导致Grid上无法正常显示。...使用ExtJS4的时候，在列模式里像下面这样处理即可。...分s秒");//"Y年m月d日H时i分s秒" } } } 当ASP.NET后台使用Newtonsoft.Json（JSON.NET）这个组件将对象序列化为...listu); JsonStr = JsonConvert.SerializeObject(ht);//使用json.net序列化 context.Response.Write
在实现的过程中，因为我们的整个项目是基于Ext js实现的，所以首先考虑的是用Ext js的Tree来实现，但是在后来做的过程中发现，由于IE在处理异步并发方面有点问题，导致显示出来的树形结构要么就是完全显示不出来...ExtJS是一个用 javascript编写，与后台技术无关的前端 ajax框架。因此，可以把 ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。 ...应用 extjs需要在页面中引入 extjs的样式及 extjs库文件，样式文件为resources/css/ext-all.css，extjs的 js库文件主要包含两个，adapter/ext/ext-base.js...因此，要使用 ExtJS框架的页面中一般包括下面几句： 此外，如果想使用汉语的话还得加入以下代码： <scriptsrc="..
最近公司的一个系统有用到Extjs框架，对于之前完全用JQuery的js插件的我来说，对Extjs的api并不熟悉。...; return; } 当我们在左侧点击编号为3的选择框时，会通过ajax方式从后台取数据显示在右侧维度字典列表组件中...通过ajax取数据的代码，返回的数据是json形式的： //数据字典store var items_store = Ext.create('Ext.data.Store', {...ExtJS提供的各种组件可以用更加标准的方式展示数据降低了开发难度。...继续演示ExtJS给我们带来的便利，当我们在右侧点击新增时，要求数据字典的值必须为值，否则弹框提醒用户，由于Extjs的特点只需加两句代码就可以搞定，如下代码中的标记处1和标记处2， //字典类型添加、
在开发期间，我们建议你使用下面这些浏览器，以获得更好的调试体验。... 1.2 Web 服务器 尽管使用 ExtJS 4 并不一定需要一个本地的web 服务器，仍然强烈建议你在开发的时候能有一个，因为 XHR 在大多数浏览器上有针对本地...如果一个 ExtJS 4 的欢迎页面出现了，代表你已经一切就绪了。 2....在我们的例子中， Ext.create 创建了一个 Ext.container.Viewport 实体。... 2.3 库文件包含方法 当你解压了你下载的 ExtJS 4 文件时，你将看到下面的这些文件： 1. ext-debug.js ——这个文件仅在开发期间使用
js写多了，维护起来不是一般的头疼，虽然可以使用VS插件让JS可以实现折叠，但是多了的话，看着都难受，哪还有心情修改。如果恰巧字母大小写或者写错了，或者误操作，多敲了一个字母，等等，又有得忙了。...从VS设计源码界面，即使布局很复杂，代码很多，你也可以很清楚的看清楚各个控件的父子关系，可以很方便的找到哪个控件，也可以很方便的折叠哪些部分。 6）可以在服务器事件中操作。...8）使用更快捷。 控件一拖（虽然我一般不拖），JS、CSS链接不需要操心了。语言也不需要操作了，会自动设置本地语言（虽然有时汉化不彻底，但是还勉勉强强）。 9）其他。一时间想不起来了。...5）要求更高的解决问题的能力。（生产力--） 由于对EXT.NET的不理解、不熟悉，或者对extjs的不了解（前面说过，使用EXT.NET也需要了解Extjs。毕竟Extjs是他爸啊。）...又比如服务器环境问题——使用EXT.NET后，直接出异常了，什么什么Json序列化的。这是你就得乖乖打上.NET3.5的补丁包了，虽然官方要求的是3.5框架，但是是不缺SP1的框架。
ajax应用中跨域一直是一个非常麻烦的问题，目前也有一些解决办法，但要么比较麻烦，要么就不具备通用性，幸好ExtJs里的ScriptTagProxy提供了跨域读取数据的功能，而且在几大浏览器上都可以正常运行...，但在使用过程中要注意几点: 1.服务端返回时，必须按以下格式返回: stcCallback1001({...})...其中stcCallback1001中的1001是自动生成的，如果是分页提交的话，每再请求一次1001会变成1002,1003...类推 2.ExtJs官方的示例中虽然ScriptTagProxy的例子并不少...学习笔记(22)-XTemplate + WCF 打造无刷新数据分页)相比，多了一个参数callBack，同时返回类型改为Stream，返回方法的处理参考了老张的(再说ExtJs与WCF之间的跨域访问)...一文 b.ExtJs的前端处理 Code <!
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
