`
endual
  • 浏览: 3558441 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

extjs grid的一个实例

EXT 
阅读更多


Ext.onReady(function(){
 
   
   
    var data = [["id1","name1","email1","sex1","age1"],
                ["id2","name2","email2","sex2","age2"],
                ["id3","name3","email3","sex3","age3"],
                ["id4","name4","email4","sex4","age4"],
                ["id5","name5","email5","sex5","age5"]
             ];
   
    var fields = ["id","name","email","sex","age"];
   
    //var render = new Ext.data.Record();
   
   
    var cm = new Ext.grid.ColumnModel([{
   
        header:"id",
        dataIndex:"id"
    },{
   
        header:"name",
        dataIndex:"name"
    },{
   
        header:"email",
        dataIndex:"email"
    },{
   
        header:"sex",
        dataIndex:"sex"
    },{
   
        header:"age",
        dataIndex:"age"
    }]) ;
   
   
    var store = new Ext.data.SimpleStore({
   
        fields:fields,
        data:data
    });
   
    var grid = new Ext.grid.GridPanel({
     
        title:"title",
        height:800,
        cm:cm,
        store:store
   
    });
   
   
//    var viewport = new Ext.Viewport({
//     
//        id:'desk',
//        layout:'border',
//        items:[{region:"north",height:50},
//            {region:"west",width:200},
//                {region:"center"}],
//           
//    })
   
    grid.render(Ext.getBody());
   


});

分享到:
评论

相关推荐

    Extjs Grid 扩展实例

    "Extjs Grid 扩展实例"是一个演示如何增强Grid功能的实践案例,通过这个实例,我们可以学习到如何在原有Grid的基础上进行自定义扩展,实现更复杂的数据管理和用户交互。 首先,"extend"在编程中通常意味着类的继承...

    extjs grid示例代码

    ExtJS Grid是Sencha ExtJS框架中的一个核心组件,它用于构建数据驱动的表格视图。Grid组件在Web应用中广泛使用,因为它提供了强大的数据展示、排序、分页、筛选和编辑功能。以下是对`ExtJS Grid`示例代码的详细解析...

    extjs的一个实例

    利用ext的grid、form等组件实现了对学生信息的增删改查。并用饼状图对学生的男女比例进行了统计。

    extjs动态表格实例(封装GRID,从STRUTS2读取后台数据 )

    Grid是ExtJS的一个关键组件,它用于展示结构化数据,并支持多种操作,如排序、筛选、分页等。在动态表格中,这意味着表格的列和数据可以随着后台数据的变化而变化,提供灵活的数据展现方式。 封装Grid是为了提高...

    Extjs grid分页1

    1. **创建Store**:首先,我们需要创建一个`Ext.data.Store`实例,用于存储数据。在这个Store中,我们需要设置`autoLoad`属性为`true`或`false`来决定是否自动加载数据,以及`pageSize`属性来指定每页显示的数据数量...

    ExtJS GRID单元格合并

    通常,这个文件会包含创建Grid实例、定义列模型、配置视图以及处理数据源的相关逻辑。通过分析和理解Grid.js的内容,你可以更深入地掌握单元格合并的实现方式。 总的来说,ExtJS 4.0 Grid的单元格合并功能是通过...

    Extjs Grid 操作大全

    - `grid`参数表示当前触发事件的Grid实例。 - `rowIndex`参数表示被双击的单元格所在的行索引。 - `columnIndex`参数表示被双击的单元格所在的列索引。 - `e`参数表示触发事件的原生事件对象。 #### 四、示例...

    ExtJS_grid.rar_Grid javascript_extjs grid

    - **Grid Panel**:是ExtJS中的一个核心组件,用于显示二维数据,可以进行排序、筛选、分页等操作。 - **Store**:存储Grid的数据,可以是从服务器获取的JSON、XML或Array格式的数据,也可以是本地数据。 - **...

    EXTJS 转EXCEL实例

    6. **创建下载链接**:创建一个HTML的`<a>`标签,设置其`href`属性为上一步生成的URL,`download`属性为预设的文件名(例如“grid_data.xlsx”)。点击这个链接即可触发浏览器的下载行为。 7. **模拟点击事件**:...

    ssh框架+extjs4.0grid实例

    在这个实例中,SSH框架与ExtJS 4.0结合,提供了强大的前端展示和后端数据处理能力。 Struts2是MVC(Model-View-Controller)架构模式的一种实现,它负责处理HTTP请求,执行业务逻辑,并将结果呈现给用户。Struts2...

    Extjs Grid 中的 ToolTip效果

    - 对于通用的Tooltip,我们可以创建一个`Ext.tip.ToolTip`实例,并配置相应的属性,如`target`(要关联的元素)和`html`(显示的内容)。 - 对于Grid的列,我们可以使用`Ext.grid.column.Column`的`tooltip`配置项...

    ExtJs动态grid的生成

    - 首先,你需要创建一个Ext.grid.Panel实例,这是ExtJS中的Grid组件。通过设置配置项如store(用于存储数据)、columns(定义列)等来定制Grid。 2. **动态生成列** - 你可以使用`columns`属性来动态生成列。例如...

    ExtJs 实例+ExtJs中文教程(学习extjs必备)

    总之,ExtJs是一个强大的JavaScript框架,通过学习提供的实例和中文教程,结合具体的代码实践,你将能够开发出功能丰富、用户体验优秀的Web应用程序。在学习过程中,不要忘记持续关注ExtJs的更新,以便利用最新的...

    ExtJs DataGridView控件实例

    1. **ExtJs Grid组件**:ExtJs 的Grid组件是一个高度可定制的数据视图,能够显示大量的数据并提供分页、排序、过滤、编辑等功能。它通常与Store组件一起使用,Store负责管理数据源,而Grid则负责显示和操作这些数据...

    ExtJs6.5Grid列表导出(包含样式)

    本文将深入探讨如何利用ExtJs的相关控件类来实现一个自定义的Grid列表导出功能,同时保持列表的样式。 首先,理解ExtJs Grid的基本结构至关重要。Grid是一个可配置的组件,用于显示数据集并提供交互式功能,如排序...

    Extjs4 MVC小实例

    在“Extjs4 MVC小实例”中,你可能能看到如何创建一个简单的MVC应用,包括模型的定义、视图的创建、控制器的编写,以及它们之间的互动。通过学习这个实例,你可以更好地掌握ExtJS 4中的MVC架构,为构建复杂、高效的...

    EXTJS Grid导出Excel

    EXTJS是一个强大的JavaScript库,专门用于构建富客户端Web应用程序,而Grid组件是其核心部分,用于展示和管理表格数据。在EXTJS中,我们可以利用其内置的功能或借助第三方插件来实现在Grid中导出数据到Excel。 ...

    extjs设计实例包含Grid和布局的设计

    extjs设计实例包含Grid和布局的设计

    extjs4 ComboBox 点击下拉框 出现grid效果

    然后,在事件处理器中,你可以创建一个Grid实例,并设置其数据源。Grid的配置可以包括列模型(column model)、存储模型(store)以及视图配置等。 例如: ```javascript var comboBox = Ext.create('Ext.form....

    extjs4 treeGrid实例

    在本实例中,我们关注的是如何利用ExtJS4实现一个TreeGrid来创建一个report报表。 首先,理解TreeGrid的基础概念。TreeGrid是树形结构和网格的结合,它将树节点的层次结构与表格的列布局结合在一起,每个树节点都...

Global site tag (gtag.js) - Google Analytics