ExtJS 的一些技巧与问题

【ExtJS 的一些技巧与问题】的更多相关文章

ExtJs 常用小技巧备忘录

1. ExtJs 给fieldLabel与fieldInput添加样式{给Input标签加入图标}http://www.w3school.com.cn/cssref/pr_background.asp 设置元素背景 Ext.create("Ext.form.TextField", { renderTo: Ext.getBody(), fieldLabel: '用户名', labelStyle: 'color:green;', fieldStyle: 'background: url(u…

ExtJS 的一些技巧与问题

1.修改列表(grid)里store的加载url grid.getStore().proxy.conn.url = "xxx.jsp"; grid.getStore().reload(); 2.Ext.data.Store里baseParams与Store.load({params:{}})的区别: baseParams里的参数是一直存在的,而params里的参数,只有load时才会传递过去,当调用reload时参数就不存在了. 3.使Window以页面的相对大小显示 width: d…

Extjs 在项目中碰到问题

1.切换tabpanel,新建tab关闭后再新建报错,在火狐下报错 TypeError: el is null el.addCls.apply(el, arguments); 这个我在下一篇文章中已经解决了,请参考. 2.Extjs调试小技巧:可以在代码中加入 console.log(tab222, "2222"); 这样就可以在浏览器中查看你要查看的变量的详细信息在火狐或者谷歌中德控制台中 3.怎么使用Extjs rest方式 Ext.define('EITru…

Extjs 项目中常用的小技巧，也许你用得着(3)

几天没写了,接着继续, 1.怎么获取表单是否验证通过: form.isValid()//通过验证为true 2.怎样隐藏列,并可勾选: hidden: true, 如果是动态隐藏的话: grid.getColumnModel().setHidden(1,true); //1 代表要隐藏的列所在位置,true代表隐藏 3.怎样隐藏列,并不可勾选(这个必须配合上边那个一块用) hideable: false, 4.怎样设置简单查询,如果所示: tbar: { xtype: 'toolbar', fr…

Extjs 项目中常用的小技巧，也许你用得着(2)

接着来,也是刚刚遇到的 panel怎么进行收缩 collapsible: true, 这会panel就会出现这个点这个就可以收缩了 panel怎么随便拉伸,也就是让那个小黑三角出现 split: true, 效果如下: 怎么添加日历显示 var panel = new Ext.Panel({ header : true, title:'日历', frame:true,//渲染面板 collapsible : true,//允许展开和收缩 autoHeight : true,//自动高度 wid…

Extjs 项目中常用的小技巧，也许你用得着(1)

我在项目中遇到的一些知识点: 1.在GridPanel中显示图片,效果对应的代码实现 { text: '是否启用', width: 80, // xtype: 'checkcolumn', dataIndex: 'IsEnabled', renderer: function boolFromValue(val) { if (val) { return '<img src=../../Content/images/true.png>' } else { return '<img src=…

Extjs 项目中常用的小技巧，也许你用得着(5)--设置 Ext.data.Store 传参的请求方式

1.extjs 给怎么给panel设背景色设置bodyStyle:'background:#ffc;padding:10px;', var resultsPanel = Ext.create('Ext.panel.Panel', { title: 'Results', width: 600, height: 400, renderTo: Ext.getBody(), bodyStyle: 'background:#ffc; padding:10px;', layout: { type: 'vb…

Extjs 项目中常用的小技巧，也许你用得着(4)---Extjs 中的cookie设置

1.ExtJs设置cookie两种方式其一:设置cookie如下 saveacct=isForm.getForm().findField('itemselector').getValue(); Ext.util.Cookies.set('saveacct',saveacct); 取cookie中数据如下 var validStatus = Ext.util.Cookies.get("saveacct"); alert(validStatus); 其二:设置cookie var coo…

Extjs学习笔记--（三，调试技巧）

FireFox 1.firedebug(略) 2.illuminations 在illuminations页面可也看到缩写的extjs的代码,同时可以进行相应的调试 3,Firedebug AutoCompleter firefox中自带的智能感知智能在单行模式下运行,所以如果要在多行模式下调试可以安装:…

ExtJS小技巧

一.从form中获取field的三个方法: 1.Ext.getCmp('id'); 2.FormPanel.getForm().findField('id/name'); 3.Ext.get('id/name');//前提是FormPanel在界面上显示出来了. 二.ExtJS如何给textfield赋值的三个方法: var value="值"; 1. fs.form.findField(id/name).setValue(value); 2. Ext.get(id/name).set…

extjs常用技巧

grid http://extjs.org.cn/node/590 监听 http://extjs.org.cn/node/593 总结 http://extjs.org.cn/node/641 常用代码片段 http://extjs.org.cn/node/648 combo录入智能提示 http://extjs.org.cn/node/691 高效的编码风格 http://extjs.org.cn/node/703 碰上大批量的修改grid的数据的时候可以这样写: Ext.suspendLa…

ExtJs之gridPanel的属性表格，编辑表格，表格分页，分组等技巧

这里藏的配置确实多.. 慢慢实践吧. <!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link rel="stylesheet" type="text/css"…

【编程技巧】ExtJs 设置GridPanel表格文本垂直居中

详细讲解见 http://blog.csdn.net/li396864285/article/details/9310983 以下是我改修的代码: { width:90, items:[{ width:75, xtype:"button", iconCls:"btn-list", text:"查询", handler:func…

【编程技巧】EXTJS中Ext.grid.GridPanel配置项autoExpandColumn的使用方法

autoExpandColumn的作用是自动伸展,占满剩余区域.一般使用在列比较少,并且大多数列都比较窄,有一列比较宽的情况下,当然什么时候使用,还是得按照实际情况确定. 使用的时候主要有三点要注意的. 1.在Ext.grid.GridPanel这个里面一定不要添加viewConfig: {forceFit: true}配置项,加上viewConfig: {forceFit: true}不会报错,是因为forceFit设置为true的时候,autoExpandColumn会被忽略 2.auto…

javascript 框架、根基技巧、布局、CSS、控件 JavaScript 类库

预筹备之 JavaScript 今朝支流的 JavaScript 框架排名中,jQuery 和 Ext 可算是佼佼者,得到了用户的普遍好评.海内的一些框架许多也是模仿 jQuery 对 JavaScript 停止了包装,不外这些框架的开山祖师 YUI 照样坚持用自己的 JavaScript 类库. jQuery 是今朝用的最多的前端 JavaScript 类库,据初步统计,今朝 jQuery 的占有率曾经跨越 46%,它算是比拟轻量级的类库,对 DOM 的操纵也比拟便利到位,支撑的后果和控件也许…

ExtJS基础知识总结：常用控件使用方式（一）

概述最近一直在做相关ExtJs方面的项目,遇到了ExtJs使用方面的一系列问题,现在将使用技巧做个记录汇总,以便于下次能够快速使用.以下都是ExtJs控件的常用方法,做简单汇总,俗话说,好记星不如烂笔头,总一天会使用的. 基础控件使用技巧 1.Grid表格操作:获取Store的数据信息和操作列表行数据 //创建一个grid var rowPanel = Ext.create('Ext.grid.Panel', {}); //获取grid对应的Store的数据条数 rowPanel.getSto…

Extjs 知识体系1-dom操作

操作dom 主要是Ext.element,主要是简单的操作 Ext.dom.CompositeElement // 操作dom集合 ps:Extjs 使用字面量{} 形式,不支持链式操作一.获取元素(Getting Elements) 1.Ext.get var el = Ext.get('myElementId');//获取元素,等同于document.getElementById('myElementId');//会缓存 2. Ext.fly var el = Ext.fly('myEle…

extjs 学习小窍门

一.从form中获取field的三个方法: 1.Ext.getCmp('id'); 2.FormPanel.getForm().findField('id/name'); 3.Ext.get('id/name');//前提是FormPanel在界面上显示出来了. 二.ExtJS如何给textfield赋值的三个方法: var value="值"; 1. fs.form.findField(id/name).setValue(value); 2. Ext.get(id/name).set…

ExtJs 4 中的MVC应用架构

一.ExtJs 4.x MVC模式的原理与作用大规模客户端应用通常不好实现不好组织也不好维护,因为功能和人力的不断增加,这些应用的规模很快就会超出掌控能力,ExtJS4带来了一个新的应用架构,不但可以组织代码,还可以减少实现的内容. 新的应用架构遵照一个类MVC的模式,模型(Models)和控制器(Controllers)首次被引入.业界有很多种MVC架构,基本大同小异,ExtJS4的定义如下: a.Model模型:模型是字段和它们的数据的集合,例如User模型带有username和passw…

extjs ajax请求与struts2进行交互

sencha extjs 5 增加一个struts2的配置,这样可以在设置好前台布局之后,与后台交互获取数据显示.现在有一个问题是struts2对于url的跳转action支持比较良好,但是对于像Extjs这样,ajax请求的,无url跳转的实现,还是需要一点点技巧的.本文实例讲解一个Ext.Ajax.request 的请求实例,返回后台处理之后的结果. 步骤一:创建struts2的配置文件struts.xml <?xml version="1.0" encoding=&quo…

extjs 常见的小问题

今天,小白就来总结下extjs的使用的时候的各种小问题或者说是小技巧.希望能够给各位刚接触extjs的朋友一点帮助. 1.当存在store的各种组件的store的autoload属性为false的时候,在某个事件进行(例如容器的展开事件expand或者某个按钮的点击事件)的情况下,需要手动的去加载store即xxx.store.load(),会发现请求的数据什么都一切正常,但是就是页面上就是不显示,经过很长时间的请教与琢磨,才知道是因为Load事件的异步照成的,解决办法是在store.load的…

Extjs中处理mouseover的闪烁问题

在使用mouseover和mouseout实现鼠标滑动效果并且target的dom较复杂时,可能会产生闪烁现象,产生这个问题的一个原因是mouseover事件本身的冒泡特性和target dom的子元素触发造成的,另外就是由于页面上其他dom的影响(特别是iframe).目前有很多方法和技巧可以解决这个问题.如果你的项目是基于Extjs,你可以使用事件对象的within方法.可以很完美的解决这个问题.…

ExtJS控件样式修改及美化

Extjs项目对富客户端开发提供了强有力的支持,甚至改变了前端的开发方式,使得开发变得更加趋向于“面向组件”.对界面的美化而言,也是根本性的改变.普通的网页美工面对extjs项目根本无法下手,需要脚本编写人员配合美工一起来完成工作(另外,spketIDE提供的样式修改工具也不理想). 修改extjs的既有样式: 1.覆盖extjs的样式表这里说的修改不是去改extjs本身的ext-all.css, 也不建议这样去做,这样会影响所有页面:而应该是用自定义的css去覆盖某些控件的默认样式.大部分控…

ExtJS与jQuery的一点细节上的对比

首先说明这不是一篇完整解读ExtJS和jQuery所有方面差异的文章,只是针对我个人刚看了两天的jQuery产生的一些疑问的整理.之前用过一段时间ExtJS,了解ExtJS的一些机制.现在做移动开发,又选定了jquery mobile,要写控件,所以需要了解jquery.(不过换工作之后应该不会再用jQuery了,坑估计是短期内填不上了) 1.jQuery是个什么东西?Ext是什么东西?(此处不是指两个框架,而是指我们在写程序的时候,经常用到的两个关键字--暂时称之为关键字) 之前用的是ExtJ…

extjs笔记

1. ExtJs 结构树.. 2 2. 对ExtJs的态度.. 3 3. Ext.form概述.. 4 4. Ext.TabPanel篇.. 5 5. Function扩展篇.. 7 6. Ext.data.Store篇.. 10 7. Ext.data.JsonReader篇一.. 12 8. Ext.data.JsonReader篇二.. 15 9. Ext.data.HttpProxy篇.. 19 10. Ext.data.…

WEB前端优化一些经验技巧

引言: 1. 慢的页面可能会网站失去更多的用户. 2. 慢500ms意味着20%的用户将放弃访问(google) 3. 慢100ms意味着1%的用户将放弃交易(amazon) 前段时间偶然看到网上的两篇关于前端优化的文章,其中大部分技巧都来自Yahoo的优化原则,这里是对两篇文章的摘抄和总结. 减少Http请求一般来说,我们从变化性上把数据分成两种类型,变和不变.那么不变的数据可以缓存,变化的数据不能缓存,这是一个常识,也就是说要减少我们的 http请求次数这个目标可以转换成把数据分为变化和不…

[ExtJS5学习笔记]第三十三节 sencha extjs 5 grid表格导出excel

使用extjs肯定少不了使用表格控件,用到表格,领导们(一般)还是惯于使用excel看数据,所以用到extjs表格的技术猿们肯定也会有导出表格excel这一个需求,本文主要针对如何在用extjs将grid表格导出到excel,使用的是前端导出,不涉及后端. 源代码打包下载将源代码嵌入到应用中查看导出按钮以及导出效果扩展支持sum统计和groupsum分组源代码打包下载本次使用的是github上的一个开源项目Exporter 下载地址:https://github.com/iwiznia…

[ExtJS5学习笔记]第三十二节 sencha extjs 5与struts2的ajax交互配置

本文地址:http://blog.csdn.net/sushengmiyan/article/details/43487751 本文作者:sushengmiyan ------------------------------------------------------------------------------------------------------------------------------------ sencha extjs 5 增加一个struts2的配置,这样可以在…

[转]Extjs中的迭代方法

原文地址:http://www.veryhuo.com/a/view/36701.html EXTJS 有很多的迭代方法,例如,你也许已知道的Ext.each,但还有另外一些不为人知且很有用的方法.首先,简要回顾下Ext.each: Ext.each 为每一个数组的成员应用同一个方法,它基本上是一个更方便的循环形式 var people = ['Bill', 'Saul', 'Gaius']; //using each to detect Cylons: Ext.each(people, fun…

ExtJS中实现嵌套表格

先看效果: 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;…