extjs学习(关于grid)

1.想要调整某一列在表格中的顺序,可以使用mapping(索引是从0开始的)

var store = new Ext.data.ArrayStore({
data:data,
fields:[
{name:‘id‘,mapping:1},
{name:‘name‘,mapping:0},
{name:‘descn‘,mapping:2}
]}
);

2、想让表格拥有斑马线的效果:加上stripeRows:true

var grid = Ext.create(‘Ext.grid.Panel‘, {

  renderTo:‘grid‘,
    stripeRows:true,

  store : store,

  columns : columns
});

3、想让 grid拥有和表格一样的border:加上 columnLines : true

var grid = Ext.create(‘Ext.grid.Panel‘, {

  renderTo:‘grid‘,
    stripeRows:true,

  columnLines : true,

  store : store,

  columns : columns
});

时间: 2024-10-11 10:01:43

extjs学习(关于grid)的相关文章

ExtJs学习之Window

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="UTF-8"> <title>EXtjs学习之Window</title> <link rel="stylesheet" type="text/css" href="extjs-

ExtJS学习第一天 MessageBox

此文用来记录学习笔记: •学习任何技术,首先都要从Helloworld开始,那么我们首要任务就是写一个简单的HelloWorld程序,带领同学们走进ExtJS的世界. •Ext.onReady:这个方法是Ext的准备函数,也就是Ext相关的代码都会在这个函数里书写,它比较类似于window的onload方法,但是注意其执行时机是在页面的DOM对象加载完毕之后立即执行. •Ext.window.MessageBox:这个类提供了ExtJS的弹出提示框.确认框等简单的小组件.我们首先根据它写出我们的

ExtJs学习-搭建开发环境

Extjs是一个非常棒的ajax框架,可以用来开发十分绚丽外观的客户端框架,能使B/S框架更加具有活力.它是一个用javascript编写的框架,与后台技术无关的ajax框架.因此,可以把ExtJs使用在asp.net.java.php等语言开发的应用程序中. 本人学习使用的是3.4版本,在3.4版本上进行学习和实验. 首先是获取Extjs框架,下载之后,解压文件到当前文件夹,目录如下所示: 编写第一个ExtJS程序 在eclipse工具中新建一个项目,引入ExtJs类库,代码在Eclipse中

ExtJs学习笔记(1)---ExtJs安装及其使用

从官网下载了ExtJs的3.2版本的SDK,包含了代码依赖的详细说明.文档.范例和其他文件.其中,adapter和resources文件是Ext正常运行所必须的,其他的仅在开发过程中使用到. Adapter:支持把Ext和其他代码库一同使用的文件 build:用于自定义构建ext-all.js的文件 docs:文档中心(仅当运行在服务器上时能够正常访问) examples:大量令人印象深刻富有洞察力的范例 resources:Ext依赖的文件,例如CSS和图片 source:ext的所有代码 在

EXTJS 4 动态grid

var grid=Ext.getCmp("GridPanel1"); var store = grid.getStore(); Ext.Ajax.request({ url:"server/grid.json", params:{}, success:function(response, option){ grid.setStore( Ext.JSON.decode(response.responseText) ); } } ); 自己下载json文件 setSto

[ExtJS学习笔记]第六节 Extjs的类系统Class System命名规则及定义和调试

本文地址: http://blog.csdn.net/sushengmiyan/article/details/38479079 本文作者:sushengmiyan -------------------------------------------------------------资源链接----------------------------------------------------------------------- 翻译来源  Sencha Cmd官方网站:    http:

[ExtJS学习笔记]第五节 使用fontawesome给你的web应用增加友好图标

本文地址: 本文作者:sushengmiyan -------------------------------------------------资源链接-------------------------------------------------------- FontAwesome glyph编码:http://fortawesome.github.io/Font-Awesome/cheatsheet/ 使用图标美化按钮: http://blog.csdn.net/jfok/articl

EXTJS中的grid显示实际行号

添加一个新的功能 [javascript] view plaincopy Ext.grid.PageRowNumberer = Ext.extend(Ext.grid.RowNumberer, { width : 40, renderer:function(value, cellmeta, record, rowIndex, columnIndex, store){ if(store.lastOptions.params!=null){ var pageindex=store.lastOptio

ExtjS学习--------Ext.define定义类

Ext类Class的配置项:(注:Extjs的 的中文版帮助文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 ExtJS配置文件和示例的下载地址:http://download.csdn.net/detail/z1137730824/7754771) 语法: define( String className, Object data, Function createdFn ) 实例: Ext.onReady(function()

ExtJS学习--------通过WindowGroup(也叫ZIndexManager)来操作window等组件

具体实现代码:(注意:在进行测试的时候最好分别进行测试,测试一个功能的时候将其他功能注释掉,否则会影响效果....)WindowGroup对象的方法可以在其参考文档中进行查看,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893  下载查看 Ext.onReady(function(){//WindowGroup的使用 var wingroup=new Ext.ZIndexManager();//两个都可以 // var wingr