- 浏览: 1182215 次
- 性别:
- 来自: 成都
最新评论
-
see1di:
你的這個function只能支持IE
js格式化显示xml -
away5678:
强烈推荐你学习ibatis,易学,灵活,易查错,效率高,以上都 ...
ibatis的点点心得 -
liuwei8728:
恩 说的也有道理
ibatis没学过 hibernate ...
ibatis的点点心得
由于 ExtJS 在做CheckboxSelectionModel的时候,没有考虑到会存在二级 三级等多级级联,导致目前存在做级联的时候,选择上级,往往会把下级 下下级选中,而实际上并没有被选中,只是视觉上view被选中了而已。项目中遇到此种情况,本来想改变界面原型的,单需求就这个样,改纠结了,一郁闷之下,将CheckboxSelectionModel的源代码做了修改,在使用的时候,需要将js和css一并引用:
js:
还不能将图片忘记了哈,附件为打包下载
js:
/* * Ext JS Library 2.0.0 * created by:raoyifeng * created at:2012-03-01 * licensing@extjs.com * */ Ext.grid.MyCheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, { header: '<div class="x-grid3-hd-checker-my"> </div>', singleSelect:true, width: 20, sortable: false, menuDisabled:true, fixed:true, dataIndex: '', id: 'checker', initEvents : function(){ Ext.grid.MyCheckboxSelectionModel.superclass.initEvents.call(this); this.grid.on('render', function(){ var view = this.grid.getView(); view.mainBody.on('mousedown', this.onMouseDown, this); Ext.fly(view.innerHd).on('mousedown', this.onHdMouseDown, this); }, this); }, onMouseDown : function(e, t){ var hd = Ext.fly(t); if(e.button === 0 && hd.hasClass('x-grid3-row-checker-my')){ // Only fire if left-click e.stopEvent(); var row = e.getTarget('.x-grid3-row'); if(row){ var index = row.rowIndex; if(this.isSelected(index)){ this.deselectRow(index); }else{ this.selectRow(index, true); } } } var isChecked = hd.hasClass('x-grid3-row-checker-on-my'); if(isChecked){ hd.removeClass('x-grid3-row-checker-on-my'); }else{ hd.addClass('x-grid3-row-checker-on-my'); } }, onHdMouseDown : function(e, t){ if(t.className == 'x-grid3-hd-checker-my'){ e.stopEvent(); var hd = Ext.fly(t.parentNode); var parentNode=hd.parent().parent().parent().parent().parent().parent().parent().parent(); var hdP=Ext.fly(parentNode); var childs=hdP.query('.x-grid3-row-checker-my'); var isChecked = hd.hasClass('x-grid3-hd-checker-on-my'); if(isChecked){ hd.removeClass('x-grid3-hd-checker-on-my'); this.clearSelections(); if(childs!=null){ for(i=0;i<childs.length;i++){ Ext.fly(childs[i]).removeClass('x-grid3-row-checker-on-my'); } } }else{ hd.addClass('x-grid3-hd-checker-on-my'); this.selectAll(); if(childs!=null){ for(i=0;i<childs.length;i++){ Ext.fly(childs[i]).addClass('x-grid3-row-checker-on-my'); } } } } }, renderer : function(v, p, record){ return '<div class="x-grid3-row-checker-my"> </div>'; } });
.x-grid3-hd-row td,.x-grid3-row-my td,.x-grid3-summary-row td{font:normal 11px arial,tahoma,helvetica,sans-serif;-moz-outline:none;-moz-user-focus:normal;} .x-grid3-row-my td,.x-grid3-summary-row td{line-height:13px;vertical-align:top;padding-left:1px;padding-right:1px;-moz-user-select:none;} .x-grid3-row-my .x-grid3-marker{padding:3px;} .x-grid3-row-my{cursor:default;border:1px solid #ededed;border-top-color:#fff;width:100%;} .x-grid3-row-checker-my,.x-grid3-hd-checker-my{width:100%;height:18px;background-position:2px 2px;background-repeat:no-repeat;background-color:transparent;background-image:url(images/row-check-sprite.gif);} .x-grid3-row-my .x-grid3-row-checker-my{background-position:2px 2px;} .x-grid3-row-selected-my .x-grid3-row-checker-my,.x-grid3-hd-checker-on-my .x-grid3-hd-checker-my{background-position:-23px 2px;} .x-grid3-hd-checker-my{background-position:2px 3px;} .x-grid3-hd-checker-on-my .x-grid3-hd-checker-my,.x-grid3-row-checker-on-my{background-position:-23px 3px;} .x-grid3-row-checker-my, .x-grid3-hd-checker-my { width:100%; height:18px; background-position:2px 2px; background-repeat:no-repeat; background-color:transparent; background-image:url(images/row-check-sprite.gif); } .x-grid3-row-my .x-grid3-row-checker-my { background-position:2px 2px; } .x-grid3-row-selected-my .x-grid3-row-checker-my, .x-grid3-hd-checker-on-my .x-grid3-hd-checker-my { background-position:-23px 2px; } .x-grid3-hd-checker-my { background-position:2px 3px; } .x-grid3-hd-checker-on-my .x-grid3-hd-checker-my, .x-grid3-row-checker-on-my{ background-position:-23px 3px; } .x-grid3-hd-row-my td, .x-grid3-row-my-my td, .x-grid3-summary-row-my td{ font:normal 11px arial, tahoma, helvetica, sans-serif; -moz-outline: none; -moz-user-focus: normal; } .x-grid3-row-my td, .x-grid3-summary-row-my td { line-height:13px; vertical-align: top; padding-left:1px; padding-right:1px; -moz-user-select: none; } .x-grid3-row-my .x-grid3-marker-my { padding:3px; } .x-grid3-row-my { cursor: default; border:1px solid #ededed; border-top-color:#fff; /*border-bottom: 1px solid #ededed;*/ width:100%; } .x-grid3-row-checker-on-my{ background-position:-23px 3px; }
还不能将图片忘记了哈,附件为打包下载
- MyComponent.rar (2.4 KB)
- 下载次数: 2
发表评论
-
js格式化显示xml
2012-09-16 14:19 1099344javascript格式化显示xml,寻找了N久,终于找到一种 ... -
linux 安装python,设置环境变量
2011-06-15 00:10 3661linux下python开发环境之一——安装python :h ... -
jad 反编译jar
2011-06-01 12:18 16291、解压到任意目录 2、确保安装了winrar 3、点击反编译 ... -
eclipse中TOMCAT配置
2011-05-24 21:23 82741.在servers中新建的SERVER上右击——属性的Gen ... -
JRebel 热插件使用手记
2011-05-19 20:24 43651.1 安装IDE-rebel插件 1. Ecl ... -
VC++ 添加外部库文件lib和dll的步骤
2011-04-13 00:17 11686总结 连接数据库的步骤过程: 1.将文件sqlapi.lib ... -
自定义Dao,反射实现
2011-04-11 09:55 978自定义dao实现 -
javascript获取指定时间函数
2011-03-16 14:03 1458function WeekDate() { ... -
没有找到mfc90ud.dll,因此这个应用程序未能启动 解决方案
2011-01-20 22:44 17071.没有找到mfc90ud.dll,因此这个应用程序未能启动. ... -
VS 与IE兼容性问题
2011-01-08 18:47 1312今天用VS08,对话框控件添加变量时候出错, 变量类型无法选择 ... -
IBM MQ 资料
2010-10-10 20:02 3997MQ介绍 消息队列技术是 ... -
java 获取操作系统收集
2010-09-07 00:37 985判断当前java程序是运行在windows平台还是运行在lin ... -
集群学习一
2010-09-01 00:40 1087一、高可用性集群系统 ... -
Apache 的11大贡献
2010-08-29 13:09 861据国外媒体报道,转眼 ... -
学习过程问题总结
2010-08-08 23:57 839starUML 启动报错:system error code: ... -
RCP 在同一个透视图中同时打开多个同一个view
2010-07-27 15:09 5698扩展 org.eclipse.ui.views 来创建 vie ... -
一些好的文章收集
2010-07-04 21:45 841ibatis dynamic sql 语句拼接:http:// ... -
webservice 部署服务的几种方式总结
2010-05-09 00:39 3496java 调用webservice的各种方法总结 现 ... -
ibatis的多表查询
2010-05-09 00:34 2079一:描述下: 使用2个表,book,user表。一对多关 ... -
groovy的点点滴滴01(转)
2010-05-07 00:53 827一、 groovy 是什么 简单地说, Groovy 是下 ...
相关推荐
ExtJS4.2 Tree 级联选择是一个用于构建用户界面的功能,特别是在处理层次结构数据时非常有用。在ExtJS库中,Tree组件允许我们展示和操作数据以树形结构显示,而级联选择功能则意味着当用户选择一个节点时,它的所有...
自定义控件允许开发者根据项目需求创建独特的用户界面元素,这些元素可能不包含在ExtJS的默认组件库中。下面将详细介绍ExtJS自定义控件的相关知识点。 1. **自定义控件基础** - **组件模型**:ExtJS基于MVC(Model...
xtype : 'jxcombo' //配置项 jxValueField:要获取值得字段名称,默认null //公共方法 getJXValue():返回自定义字段的值,如果没有自定义字段,则等价Ext.form.Combo类的getValue()方法
该代码仅适用于ExtJs5.x, 使用方法: 在Extjs5.x.js文件后引入以下两文件,注意顺序和路径: 例如: <script type="text/javascript" src="ext/5.1/ext-all-debug.js"></script> ${src}/DateTimePicker.js"> ${src...
在EXTJS6中,日期时间控件是一种强大的用户界面组件,它将传统的日期选择器与时间选择器结合在一起,提供了一种便捷的方式来输入和编辑日期和时间数据。这个控件在许多应用程序中都非常实用,特别是在那些需要精确...
2. **日期时间控件(DateTime Field)**:在ExtJS中,日期和时间的输入通常通过`Ext.form.field.Date`和`Ext.form.field.Time`实现,但为了同时处理日期和时间,可以使用`Ext.picker.DateTime`或自定义组合控件。...
理解并掌握这些知识点,你就能有效地在ExtJS应用中实现和使用微调控件,为用户提供直观且易用的交互体验。通过实践和调试压缩包中的"spinner"文件,你可以深入理解其工作原理,并将这些知识应用到自己的项目中。
说明:本例主要实现在树节点数据过多的情况下对数据进行异步请求,并且在请求数据返回前台的同时实现级联选择。使用ExtJs版本为4.1.1a,在struts2下测试通过。例子仅供提供思路,简单易懂,不负责代码优化,哈哈!
在 ExtJS3.3基础上开发的. 低一点的版本应该也能用. 没有去测试. 参考: Ext.PagingToolbar.js 如有BUG还请各位提出或留言. 附件中有图片, 一看就知道. 用法: var grid = new Ext.grid.GridPanel({ bbar: new Ext....
标题提到的"extjs6.2月份年份控件.rar"是一个针对EXTJS 6.2版本定制的日期选择组件,它专注于年份的选择,而不涉及具体的月份和日期。这种控件在某些特定场景下非常有用,例如只需要用户输入年份的信息时。 EXTJS ...
通过这个压缩包,开发者可以学习如何自定义ExtJS组件来满足特定需求,如创建具有特定行为的时间选择器和IP地址输入框。这不仅涉及ExtJS API的使用,还包括对JavaScript和HTML的理解,以及前端开发的基本原理。对于想...
自定义控件库是ExtJS开发中的一个重要资源,它体现了开发者对于业务理解和技术实践的积累,可以帮助团队快速开发出高质量的应用。在实际使用时,应根据具体需求选择合适的控件,并结合自身项目的特点进行适当的修改...
总之,“extjs3.2、3.3 时间控件 日期控件扩展”是关于如何在ExtJS 3.x版本中使用和自定义日期及时间选择器的知识点,涵盖了基本使用、扩展开发、实际应用等多个方面。通过深入理解这些概念,开发者可以创建出更加...
在“EXTJS时间控件精确秒”这个主题中,我们将深入探讨EXTJS如何实现时间控件的秒级精确选择,以及如何自定义和优化这一功能。 EXTJS的时间控件主要通过`Ext.form.field.Time`类来实现。这个类提供了一个标准的时间...
在标签中提到的"扩展日期控件"可能指的是DateTimeField组件在ExtJS中的扩展功能,比如自定义格式化、验证规则、事件监听等。这些扩展功能增强了标准日期时间选择器的灵活性和可定制性,以满足不同项目的需求。 在...
ExtJS ComboBox级联是一种在Web应用中常见的交互方式,它允许用户从下拉列表中选择一个值,并且这个选择会影响到另一个ComboBox的选择项,通常用于表示层级关系的数据,比如省份-城市-区县。这种功能在数据筛选、...
8. **自定义模板**:如果你对默认的显示样式不满意,可以自定义模板,以满足特定的设计需求。 9. ** Accessibility**:ExtJS 4.0也考虑了无障碍性,日期时间控件可以配合键盘导航和屏幕阅读器使用,符合WCAG 2.0...
### ExtJs 6.2 中包含文本及时间选择框的自定义查询控件解决方案 在ExtJs 6.2框架中实现一个具有文本输入与时间选择功能的自定义查询控件是一个常见但实用的需求。本篇文章将详细介绍如何设计并实现这样一个控件,...
在本篇文章中,我们将深入探讨一个具体的技术问题:在ExtJS框架中,Google浏览器与DateField控件的不兼容性问题。这个问题对于那些正在使用ExtJS进行Web应用程序开发的开发者来说,是一个非常实用且需要解决的技术...