置顶 跟我一起学extjs5(20模块Grid的其他功能的设想,前20节源码)

跟我一起学extjs5(20--模块Grid的其他功能的设想,前20节源码)


        经过对自定义模块和Grid的设计和编码,现在已经能对一个有配置信息的模块来生成界面并进行一些简单的CURD操作。由于这是一个全解释性的前台的架构,因此你想到的任何新主意都可以放到所有的模块中。
        比如对于“Grid列宽的自动适应”这个功能,我们可以在系统设置项里加入“列宽自适应模式”,下面有三个选项:1、不自动适应;2、首次加载数据时自动适应;3、每次加载数据都自动适应。因为列宽自动适应需要时间,如果字段很多,记录很多会比较慢,因此可以加入这个设置,使用户根据自己的喜好来设置。还可以对每种类型的字段做一些设置,比如日期的显示格式、浮点型的数值要不要加分节符号,小数位数,颜色等等。
        下面再介绍一个使用MVVM特性的小功能,在title上显示当前选中的记录的nameField。先截图看看效果:
置顶

        跟我一起学extjs5(20模块Grid的其他功能的设想,前20节源码)


置顶

        跟我一起学extjs5(20模块Grid的其他功能的设想,前20节源码)


        下面具体的修改,先在Grid.js中将bind的语句改一下
			bind : {
				title : '{tf_title} {selectedNames}' // 数据绑定到ModuleModel中的tf_title 和
				// 选中记录的名称
			},
        然后再在 ModuleModel.js中的data中加入属性:

				selectedNames : ''   //选中的记录的names显示在title上
 

       Grid的记录选中事件在前几节中已经加了,只要修改一下事件函数就可以了,修改ModuleController.js

	// 选中的记录发生变化过后的事件
	selectionChange : function(model, selected, eOpts) {
		// 设置删除按钮的状态
		this.getView().down('toolbar button#delete')[selected.length > 0
				? 'enable'
				: 'disable']();

		var viewModel = this.getView().getViewModel();
		// 下面将组织选中的记录的name显示在title上,有二种方案可供选择,一种是用下面的MVVM特性,第二种是调用refreshTitle()
		var selectedNames = ''
		if (selected.length > 0) {
			if (!!selected[0].getNameValue())
				selectedNames = selectedNames + ' 『<em>' + selected[0].getNameValue()
						+ '</em>'
						+ (selected.length > 1 ? ' 等' + selected.length + '条' : '') + '』';
		}
		viewModel.set('selectedNames', selectedNames); // 修改ModuleModel中的数据,修改好后会自动更新bind的title
		// this.getView().down('grid').refreshTitle(); // 这是不用MVVM特性的做法
	},

        简单的几句,就又加了一个新的功能。有问题或建议请,或与我联系:[email protected]

        想下载源码的可以到我的资源里去下载,或者点击打开链接进入下载页面。

 














更多相关文章
  • 目录管理 1.mkdir 创建空目录 -p 在创建目录的时候路径不存在时自动创建路径目录 -v 详细信息 , 可以显示创建过程 同时创建多个 /a/b/{c,d/e} 花括号展开 {a,b}_{c,d} == a_c , a_d , b_d , b_c 2.tree 查看文件或目录数 3.rmdir ...
  • 今天遇到一个问题,就是“NeatUpload大文件上传控件而导致Nonfile portion > 4194304 bytes错误”,百度后发现了一个解决方法,跟大家分享下: NeatUpload是一个开源的大文件上传控件,非常的强大,支持文件类型过滤.上传进度条显示.多文件上传等强大的功能. ...
  • 1.调用cclayer的方法setAccelerometerEnabled(true)在层里启用重力感应 2.启用重力感应后,重力方向变化时,会回调cclayer的方法didAccelerate( CCAcceleration* pAccelerationValue ),在自己派生的层里重写此方法, ...
  • 最近都在做linq+ext.net的开发.这两天想学习下MVC和ef,刚好,在看ext.js的时候也喜欢上了esayui,所以就想用mvc+ef+esayui做一个汽车网后台管理来加强下.在这里也把我的经验和大家分享下.好了开始项目的准备工作,先准备下EsayUI的一些文件,可以到http://ww ...
  • Ctrl+E,D -格式化全部代码 Ctrl+A+K+FCtrl+E,F -格式化选中的代码 Ctrl+K+FCTRL + SHIFT + B生成解决方案 Alt+B+B 或 F6 生成当前项目 Alt+B+U 或 Shift+F6CTRL + O 打开文件CTRL + SHIFT + O打开项目C ...
  • (二) 你适合当程序员吗,你知道编程序是怎么回事吗?1. 程序员意味着要编程序.(如果你仅仅想得到一份高薪水的工作,喝喝咖啡就等老板发薪水,我奉劝你还是另找一份更合适的工作,譬如练摊,真的,兄弟,这份工作不适合你)2.你是学文的还是学理的,编程序也许需要浪漫,但更需要逻辑和严谨.(说坦白点就是,在你 ...
一周排行
  • 易网科技讯 3月18日消息,据外国媒体报道,在线云存储服务Google Drive开始出现故障,这是星期一早晨的头等大事.用户发来大量反馈信息表示云存储服务很不稳定,目前Twitter上类似投诉也四处可见.谷歌的服务 ...
  • 这种错误经常碰到,跟操作系统.ArcGIS版本.Oracle版本都没有什么关系,唯一的问题在于用户的数据.Esri对Error 000210的错误是如下解释:DescriptionThe output cannot ...
  • @{Html.EnableClientValidation(false);}
  • ubuntu下MYSQL配置和管理   一.MySQL的安装 1.在线安装: 命令:sudo apt-get install mysql-server 在安装的过程中将提示为“root”用户设置密码,输入自己的密码即 ...
  • Ubuntu 12.04安装NFS server   首先安装nfs-kernel-server   [plain]  apt-get install nfs-kernel-server     然后创建一个 ...
  • 项目名称======================在这里我写一个项目概述 段落分明.[空行](http://example.com/) 的项目概述. 如何使用### 排队 ###内嵌代码.**反引号** (`` ` ...
  • 上一篇主要介绍Expression系列产品,另外概述了Blend的强大功能,本篇将用Blend 3创建一个新Silverlight项目,通过创建的过程,对Blend进行快速入门学习.   在开始使用Blend前,首先 ...
  • 中新网7月17日电 据日本共同社报道,联合国<公民权利和政治权利国际公约>(B公约)人权委员会15日和16日两天在日内瓦的联合国欧洲总部对日本进行了审查,不少委员要求日本政府对"仇恨言论&quo ...
  • 算法常用术语英中对照 Approximate String Matching 模糊匹配 Arbitrary Precision Arithmetic 高精度计算 Bandwidth Reduction 带宽压缩 Bi ...
  • Tip:红色字体为简要部分 <[arm驱动]Platform设备驱动>涉及内核驱动函数五个,内核结构体三个,分析了内核驱动函数四个:可参考的相关应用程序模板或内核驱动模板零个,可参考的相关应用程序或内核驱 ...