`
jyangzi5
  • 浏览: 207506 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

Ext grid属性

    博客分类:
  • Ext
阅读更多

转自:http://qinya.iteye.com/blog/610512

 

 

表格的属性分为配置属性(在操作表格时无法修改)
以及其他可读写属性,方法,以及事件。
如下:

配置属性


a) activeItem:         渲染布局时激活的子元素。
b) applyTo:            指定渲染对象。
c) autoDestroy:        当容器的子元素从容器中移除时是否自动销毁。
d) autoExpandColumn:  指定自动填充表格剩余区域的列id
e) autoExpandMax:     可自动扩张的最大宽度。
f) autoExpandMin:     可自动扩张的最小宽度
g) autoHeight:        自动扩充高度
h) autoShow:           是否自动显示
i) autoWidth:         自动扩充宽度
j) bbar/tbar:          底部/顶部状态栏
k) bufferResize:       容器再布局的缓冲频率
l) colModel/cm:        列模式
m) cls:                  组件的额外css格式。
n) collapsible:        是否显示快捷隐藏按钮
o) defaults:            指定默认配置。
p) disableSelection:   是否禁止选择表格行或列
q) enableDragDrop:     是否允许表格列的拖放操作。
r) enableHdMenu:       是否显示表格列的菜单。
s) frame:               边框是否显示
t) loadMask:           是否显示加载动画
u) selModel/sm:        表格选择模式
v) store:             表格数据集
w) stripeRows:          是否显示分隔线。
x) title:                 表格标题
y) viewConfig: {
       forceFit: true   //自适应每个列的宽度
    }
z)sortable:   实现排序 
  Ext.grid.ColumnModel{
   {header: "编号" , dataIndex:"id",sortable: true }
...
}

aa)sortInfo: 解决中文排序
var store=new Ext.data.Store({
  proxy:new Ext.grid.MemoryProxy(data),
  read:new Ext.data.ArrayReader({},[
       {name:id},
       ...
]),
sortInfo:{field:"name", direction:"ASC"}

}) ;
然后在重写Ext.data.Store的applySort函数
Ext.data.Store.prototype.applySort=function(){
if(this.sortInfo&&!this.remoteSort){
    var s=this.sortInfo, f=s.field;
var st=this.fields.get(f).sortType;
var fn=function(r1,r2){
   var v1=st(r1.data[f]), v2=st(r2.data[f]);
  if(typeof(v1)=="string"){
     return v1.localCompare(v2);
}
return v1>v2?1:(v1<v2?-1:0);
};
this.data.sort(s.direction,fn);
if(this.snapshot && this.snapshot != this.data){
    this.snapshot.sort(s.direction.fn);
}
}
};
将这段代码加到ext-all.js最后面,或者放到html页面最上面,总之在ext初始化之后,实际代码调用它之前执行

显示日期类型数据:{name:data,type:'data',dataFormat:'y-m-dTH:i:s'}
{name:data,type:'data',renderer:render}

function render(value,cellmeta,record,rowIndex,columnIndex,store){
value:对应单元格的值
cellmeta,单元格的属性(id css)
record,这行数据对象如果获取其他列使用 record.data['id']
rowIndex,行号(当前页中所有记录的顺序)
columnIndex,当前列号
store 购置表单时传递的ds,
}






方法


a) getColumnModel():       得到表格列模型
b) getGridEl():            得到表格下的元素
c) getPosition():          得到组件的当前位置,返回一个数组
d) getSelectionModel():    得到选中模型
e) getSize():              得到组件大小
f) getStore():             得到组件的数据集
g) getView():              得到表格的GridView对象。
h) hide():                 隐藏当前组件
i) isVisible():            判断当前组件是否显示
j) setDisabled( Boolean):  设置组件的可用性
k) un():                   解除组件的监听
l) on():                     为组件添加监听
on ( String eventName, Function handler, [Object scope] )
       eventName:          添加监听的名称
        handler:            事件处理函数
        scope:               事件响应的作用域,
                                包括scope,delay,single,buffer。




例如:
var jsonArray1 = [];
var selections = grid.getSelectionModel().getSelections();
for (var i = 0; i < selections.length; i++) {
var record = selections[i];
    jsonArray1.push(record.data);
   alert('提示',selections.length+record.get("ODEFINEID") + "," +     record.get("ODEFINENAME") + "," + record.get("DATASOURCEID"));
}

分享到:
评论
1 楼 woniu_comeon 2011-03-16  
挺全的

相关推荐

    extgrid属性[文].pdf

    extgrid属性[文].pdf

    EXTGrid属性方法

    extjs 4.0 Grid属性方法以及常用操作,板面属性和对象

    Ext.grid.GridPanel属性祥解

    Ext.grid.GridPanel属性祥解, 表格部门的详解,通俗易懂,适合初学人员,以及想对GridPanel有个精析认识的Web开发人员

    在Ext的grid里实现带radio单选功能的gridlist

    在Ext的grid里实现带radio单选功能的gridlist

    ExtJS下grid的一些属性说明

    1.界面修改(css style): Extjs中界面风格与我们产品本身的风格有很大不同,从边框、... 属性的作用(About Ext.grid. GroupingView, EditorGridPanel): Extjs的grid功能强大,如排序、隐藏列或移动列等,这些都有一些属

    ext5.0中将grid导出excel文件

    根据网络上已有的导出代码,替换ext2.0中的函数和属性为ext5.0版本。 无选择项默认导出全表。 未考虑grid分页的情况。 默认设置导出文件名为grid中name属性+当天年月日。 没有研究出data uri协议导出excel文件时动态...

    ext5.0中grid导出excel文件

    ext5.0 根据网络上的导出文件替换ext2.0中的函数和属性。 无选择项默认导出全表。 未考虑grid分页的情况。 默认设置导出文件名为grid中name属性+当天年月日。 没有研究出data uri协议导出excel文件时动态修改文件名...

    EXT核心API详解

    73、Ext.grid.EditorGridPanel类 ……… 62 74、Ext.grid.PropertyGrid类 …………… 65 1、Ext类 addBehaviors(Object obj) : void 对选择的元素 应用事件侦听器,事件名以@附加在结尾,例如 addBehaviors({ ...

    Ext 开发指南 学习资料

    2.10.1. 谓之曰PropertyGrid属性表格 2.10.1.1. 小插曲:只能看不能动的PropertyGrid。 2.10.1.2. 小舞曲:强制对name列排序 2.10.1.3. 小夜曲:根据name获得value 2.10.1.4. 奏鸣曲:自定义编辑器 2.10.2. 分组表格...

    Ext Js权威指南(.zip.001

    Ex4.0共2个压缩包特性,《ext js权威指南》 ...10.3.4 数据汇总功能:ext.grid.featrue.abstractsummary与ext.grid.featrue. summary / 539 10.3.5 分组功能:ext.grid.featrue.grouping / 543 10.3.6 分组汇总...

    EXT2.0中文教程

    2.10.1. 谓之曰PropertyGrid属性表格 2.10.2. 分组表格,嘻嘻,这是交叉报表吗? 2.11. 午夜怪谈,论可以改变大小,可以拖拽的表格 2.11.1. 先看看怎么拖拽改变表格的大小 2.11.2. 再看怎么在表格里拖动行 2.11.2.1....

    EXT教程EXT用大量的实例演示Ext实例

    2.10.1. 谓之曰PropertyGrid属性表格 2.10.2. 分组表格,嘻嘻,这是交叉报表吗? 2.11. 午夜怪谈,论可以改变大小,可以拖拽的表格 2.11.1. 先看看怎么拖拽改变表格的大小 2.11.2. 再看怎么在表格里拖动行 2.11...

    EXT组件初学者教程 grid+tree+window+描述文档

    EXT组件grid+tree+window+ssm框架+代码解释属性文档+开发源代码。实现tree结构树的自动加载与自动选中,以及点击子节点自动勾选父节点,点击父节点自动勾选所属下方所有子节点

    Ext 学习中文手册

    Item属性 57 在UI中摆放菜单 58 Menu的分配方式: 58 练一练 60 动态添加菜单按钮到Toolbar 61 更方便的是 61 下一步是 62 模板(Templates)起步 62 第一步 您的HTML模板 62 第二步,将数据加入到模板中 62 下一步 ...

    Ext修改GridPanel数据和字体颜色、css属性等

    Ext修改GridPanel数据和字体颜色等,不是单指EditGridPanel 首先获取选中的行(当然也可以获取单元格): 代码如下: var selectedRow = grid.getSelectionModel().getSelected(); 修改设置: 代码如下: selectedRow....

    ext 4.0 学习笔记.doc

    ext 4.0 学习笔记(1)Array Grid ...这套笔记讲解每一种对象的属性未必是完全的,主要是讲解EXT4.0自带demo,要深入学习的可以去查看API,我的资源有EXT3.0的中文API 今天学习的是:Array Grid,效果如下:

    EXT 中文帮助手册

    列模型(Column Model) 52 Grid组件的简易分页 53 Grid数据 53 怎么做一个分页的Grid 54 分页栏Toolbar 55 EXT Menu组件 55 创建简易菜单 56 各种Item的类型 57 Item属性 57 在UI中摆放...

    EXT简体中文参考手册(PDF&CHM电子档)

    Item属性 57 在UI中摆放菜单 58 Menu的分配方式: 58 练一练 60 动态添加菜单按钮到Toolbar 61 更方便的是 61 下一步是 62 模板(Templates)起步 62 第一步 您的HTML模板 62 第二步,将数据加入到模板中 62 下一步 ...

    GridPanel属性详解

    详细介绍GridPanel各项属性,ExtJS 普通表格:Ext.grid.GridPanel属性详解

Global site tag (gtag.js) - Google Analytics