ExtJs ArrayGrid简单例子
2013-03-15 13:05
120 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <link rel="stylesheet" type="text/css" href="css/ext-all.css" /> <script type="text/javascript" src="js/ext-base.js"></script> <script type="text/javascript" src="js/ext-all-debug.js"></script> <script type="text/javascript"> Ext.onReady(function(){ function sexChange(val){ if(val=="男") { return '<span style="color:green">'+val+'</span>'; } else { return '<span style="color:red">'+val+'</span>'; } } function ageChange(val){ if(val>20) { return '<span style="color:green">'+val+'</span>'; } else { return '<span style="color:red">'+val+'</span>'; } } var myData=[['张三','男',20, 90], ['刘思','女',24, 45], ['齐硫','男',18, 95]]; var cm =new Ext.grid.ColumnModel([{id:'name',header:'name',dataIndex:'name'}, {header:'sex',width:75,sortable:true,renderer:sexChange,dataIndex:'sex'}, {header:'age',width:75,sortable:true,renderer:ageChange,dataIndex:'age'}, {header:'score',width:75,sortable:true,dataIndex:'score'}]); var store = new Ext.data.ArrayStore({ fields:[{name:'name'},{name:'sex'},{name:'age'},{name:'score'}] }); store.loadData(myData); var grid = new Ext.grid.GridPanel({ cm:cm, store:store, width:700, height:600, autoExpandColumn:'name', title:'Array-Grid', renderTo:'my-grid' }); }); </script> </head> <body> <div id="my-grid"></div> </body> </html>
相关文章推荐
- heapsort的一个简单的例子
- SQLServer 在存储过程里使用事务控制的简单小例子
- RSA加密学习的简单例子
- 一个简单的GNU getopt函数的测试例子
- 使用eclipse创建JPA-->:附带一个简单的例子
- 一个简单的线程例子
- JNotify的监测文件变化的简单测试例子
- Android中Activity和Service简单交互的例子
- spring mvc(注解)上传文件的简单例子
- 一个简单的jquery选择器例子
- SSH入门简单搭建例子
- Libevent使用例子,从简单到复杂
- dwr小例子最简单的
- QT多线程简单例子
- Robot Framework与Web界面自动化测试:简单例子
- OT源代码的分析,OrtHello 迟早攻破你 (七)第2个例子,碰撞和简单运动
- 【Linux】一个简单的线程创建和同步的例子
- JNI 简单例子小结 (调用外部DLL)
- java 发送邮件的简单例子
- [MEF插件式开发] 一个简单的例子