/**
* @author sux
* @time 2011-1-14
* @desc 部门信息显示
*/
deptInfoGridPanel = Ext.extend(Ext.grid.EditorGridPanel,{
id: 'deptInfoPanel',
//renderTo: Ext.getBody(), //渲染到body
constructor: function(){
Ext.QuickTips.init();
this['store'] = new Ext.data.JsonStore({
url: 'dept_list.action',//如果有值传入,会为该URL创建一个HttpProxy对象
root: 'root',//JSON对象的key指定,这里指的是服务器传递过来的json变量的命名
totalProperty: 'totalProperty',//这里指的是查询出来的条数,也是由服务器传递过来
//record
fields: ['deptId','deptName',
'deptNum','deptMgr','deptRemark']//对象数组集合在实际应用中fields我们可以使用遍历list等方式往里面传值。
});
var rowNumber = new Ext.grid.RowNumberer(); //序列号
var checkbox = new Ext.grid.CheckboxSelectionModel(); //{默认是多选singleSelect: false}
deptInfoGridPanel.superclass.constructor.call(this,{
width: Ext.getCmp('mainTab').getActiveTab().getInnerWidth(),//获取当前活动的tab
height: Ext.getCmp('mainTab').getActiveTab().getInnerHeight(),
/**表格高度自适应 document.body.clientHeight浏览器页面高度 start**/
monitorResize: true,
doLayout: function() { //必须在调用doLayout()方法,更新一下布局,Ext中表格自适应高度
this.setWidth(document.body.clientWidth-205);
this.setHeight(document.body.clientHeight-140);
Ext.grid.GridPanel.prototype.doLayout.call(this);
} ,
/**end**/
viewConfig: {//表格视图的配置对象
forceFit: true,
columnsText : "显示/隐藏列",//表格标题菜单中列对应的文字描述
sortAscText : "正序排列",//表格标题菜单中升序的文字描述
sortDescText : "倒序排列"//表格标题菜单中降序的文字描述
},
sm: checkbox,//表格的选择模式,默认为Ext.grid.RowSelectionModel
columns: [
rowNumber, checkbox,
{
header: '部门编号',//表头文字
dataIndex: 'deptId',//设置列与数据集中数据记录的对应关系,值为数据记录中的字段名称
align: 'center'//列数据的对齐方式
},{
header: '部门名称',
dataIndex: 'deptName',
align: 'center'
},{
header: '部门人数',
dataIndex: 'deptNum',
align: 'center'
},{
header: '部门经理',
dataIndex: 'deptMgr',
align: 'center'
},{
header: '备注',
dataIndex: 'deptRemark',
name: 'deptRemark',
renderer: Ext.hrmsys.grid.tooltip.subLength,//设置列的自定义单元格渲染函数
align: 'center'
}],
tbar: new Ext.Toolbar({//多行工具栏
style: 'padding: 5px;',
id: 'departToolbar',
items: ['条目:',{
xtype: 'combo',
width: 80,
triggerAction: 'all',
editable: false,
mode: 'local',
store: new Ext.data.SimpleStore({
fields: ['name','value'],
data: [[" ","全部"],["deptId","部门编号"],["deptName","部门名称"],["deptMgr","部门经理"]]
}),
id: 'condition_dept',
displayField: 'value',
valueField: 'name',
emptyText: '请选择'
},'内容:',{
id: 'condition_dept_value',
xtype: 'textfield',
listeners : {
specialkey : function(field, e) {//添加回车事件
if (e.getKey() == Ext.EventObject.ENTER) {
queryDeptFn();
}
}
}
},{
text: '查询',
tooltip: '查询部门',
iconCls: 'search',
hidden: 'true',
id: 'dept_query',
handler: queryDeptFn
},{
text: '删除',
tooltip: '删除部门',
id: 'dept_delete',
iconCls: 'delete',
hidden: 'true',
handler: delDeptFn
},{
text: '添加',
tooltip: '添加部门',
id: 'dept_add',
hidden: 'true',
iconCls: 'add',
handler: addDeptFn
},{
text: '修改',
id: 'dept_update',
iconCls: 'update',
hidden: 'true',
tooltip: '修改部门',
handler: updateDeptFn
}]
}),
bbar: new PagingToolbar(this['store'], 20)//分页工具栏
});
this.getStore().load({
params:{
start: 0,
limit: 20
}
});
//new Ext.Viewport().render();
}
}); addDeptFn = function(){
deptAddWin = new DeptAddWin();
deptAddWin.show();
}; delDeptFn = function(){
gridDel('deptInfoPanel','deptId', 'dept_delete.action');
}; updateDeptFn = function(){
deptAddWin = new DeptAddWin();
deptAddWin.title = '部门信息修改';
var selectionModel = Ext.getCmp('deptInfoPanel').getSelectionModel();
var record = selectionModel.getSelections();
if(record.length != 1){
Ext.Msg.alert('提示','请选择一个');
return;
}
var deptId = record[0].get('deptId');
Ext.getCmp('deptAddFormId').getForm().load({
url: 'dept_intoUpdate.action',
params: {
deptId: deptId
}
})
deptAddWin.show();
}; queryDeptFn = function(){
var condition = Ext.getCmp('condition_dept').getValue();
var conditionValue = Ext.getCmp("condition_dept_value").getValue();
Ext.getCmp("deptInfoPanel").getStore().reload({
params: {
condition: condition,
conditionValue : conditionValue,
start: 0,
limit: 20
}
})
};

26.Extjs 部门列表信息展示页面的更多相关文章

  1. Python 爬取 北京市政府首都之窗信件列表-[信息展示]

    日期:2020.01.25 博客期:133 星期六 [代码说明,如果要使用此页代码,必须在本博客页面评论区给予说明] //博客总体说明 1.准备工作 2.爬取工作 3.数据处理 4.信息展示(本期博客 ...

  2. django学习-27.admin管理后台里:对列表展示页面的数据展示进行相关优化

    目录结构 1.前言 2.完整的操作步骤 2.1.第一步:查看ModelAdmin类和BaseModelAdmin类的源码 2.2.第二步:查看表animal对应的列表展示页面默认的数据展示 2.3.第 ...

  3. 微信小程序信息展示列表

    微信小程序信息展示列表 效果展示: 代码展示: wxml <view class="head"> <view class="head_item" ...

  4. JSP中实现留言页面的编写并将留言信息展示出来

    1.JavaBean类,实现java代码和html的部分分离,提高代码的复用 package com.wgh; public class MessageBean { private String au ...

  5. Extjs4.2如何实现鼠标点击统计图时弹出窗口来展示统计的具体列表信息

    var pageSize = 20;//初始化每页数据条数 var winTitle = '';//初始化窗口标题 /** *点击统计图时,弹出一个窗口,显示统计的详情列表信息, *该方法为项目中所有 ...

  6. 无废话ExtJs 入门教程十六[页面布局:Layout]

    无废话ExtJs 入门教程十六[页面布局:Layout] extjs技术交流,欢迎加群(201926085) 首先解释什么是布局: 来自百度词典的官方解释:◎ 布局 bùjú: [distributi ...

  7. MVC+EF+PagedList+调用通用存储封装+多表联合信息展示分页+存储过程分页

    主要的技术点不在这里一一阐述,相关存储也是引用别人的,主要技术点就是通过最优性能方式处理需求,PagedList.包需要在线安装就可以 直接上干货 1.存储代码之第一种: 参数相对多点 /**//* ...

  8. 从产品展示页面谈谈Hybris系列之二: DTO, Converter和Populator

    文章作者:张健(Zhang Jonathan) 上一篇文章 从产品展示页面谈谈Hybris的特有概念和设计结构 我们讲解了Hybris一些特有的概念以及大体架构,并且介绍了Facade层里是如何定义D ...

  9. XMPP个人信息展示

    在现阶段的通信服务中.各种标准都有,因此会出现无法实现相互连通,而XMPP(Extensible Message and presence Protocol)协议的出现.实现了整个及时通信服务协议的互 ...

随机推荐

  1. Python关于函数作为返回值的理解(3分钟就看完了)

    话不多说,直接看例子,上代码: def line_conf(): def line(x): return 2 * x + 1 return line #return a function object ...

  2. 什么是CPU密集型、IO密集型?(转发)

    CPU密集型(CPU-bound) CPU密集型也叫计算密集型,指的是系统的硬盘.内存性能相对CPU要好很多,此时,系统运作大部分的状况是CPU Loading 100%,CPU要读/写I/O(硬盘/ ...

  3. 关于自定义checkbox-radio标签的样式的方法(label 和 background-position理解)

    label label标签有一个很好的作用就是扩大表单控件元素的点击区域. 一般有两种方法可以达到效果:(1)使用label标签包裹表单控件(2)设置label标签的for属性和表单的id属性一致 这 ...

  4. [网络流24题] 方格取数问题(cogs 734)

    «问题描述:在一个有m*n 个方格的棋盘中,每个方格中有一个正整数.现要从方格中取数,使任意2 个数所在方格没有公共边,且取出的数的总和最大.试设计一个满足要求的取数算法.«编程任务:对于给定的方格棋 ...

  5. 【BZOJ4474】isomorphism(树的同构,哈希)

    题意:一个无向树的度数为 2的结点称为假结点,其它结点称为真结点.一个无向树的简化树其结点由原树的全体真结点组成,两个真结点之间有边当且仅当它们在原树中有边,或者在原树中有一条联结这两个结点的路,其中 ...

  6. A Simple Problem with Integers-POJ3468

    Description You have N integers, A1, A2, ... , AN. You need to deal with two kinds of operations. On ...

  7. SpringBoot常用注解总结

    在SpringBoot框架中,注解做为一种隐式配置,极大的简化了之前xml文件的配置方式.SpringBoot中包含许多种类的注解,这里对在SpingBoot项目中经常使用到的一些注解的进行大致的归纳 ...

  8. STL算法设计理念 - 函数对象和函数对象当參数和返回值

    函数对象: 重载函数调用操作符的类.其对象常称为函数对象(function object),即它们是行为类似函数的对象. 一个类对象,表现出一个函数的特征,就是通过"对象名+(參数列表)&q ...

  9. 【c++】static_cast, dynamic_cast探讨

    C++类型转换分为:隐式类型转换和显式类型转换 一.隐式类型转换 1) 算术转换(Arithmetic conversion) : 在混合类型的算术表达式中, 最宽的数据类型成为目标转换类型. ; d ...

  10. CentOS 7加强安全性:

    CentOS 7加强安全性:1. 更改 root 密码************************************************************************* ...