`
chengyu2099
  • 浏览: 468907 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

ExtJS组件 - store ①

EXT 
阅读更多
Ext.onReady(function(){
	
	Ext.BLANK_IMAGE_URL = '../ext-2.2/resources/images/default/s.gif';
	
    var cm = new Ext.grid.ColumnModel([
        {header:'编号',dataIndex:'id',sortable:true},
        {header:'名称',dataIndex:'name',width:80},
        {id:'descn',header:'描述',dataIndex:'descn'},
        {header:'日期',dataIndex:'date', renderer: Ext.util.Format.dateRenderer('Y-m-d')}
    ]);

    var data = [
        ['1','name1','descn1','1970-01-15T02:58:04'],
        ['2','name2','descn2','1970-01-15T02:58:04'],
        ['3','name3','descn3','1970-01-15T02:58:04'],
        ['4','name4','descn4','1970-01-15T02:58:04'],
        ['5','name5','descn5','1970-01-15T02:58:04']
    ];

    var store = new Ext.data.Store({
        proxy: new Ext.data.MemoryProxy(data),
        reader: new Ext.data.ArrayReader(
	        {},
	        [
	            {name: 'id'},
	            {name: 'name'},
	            {name: 'descn'},
	            {name: 'date', type:'date',dateFormat: 'Y-m-dTH:i:s'}
	        ])
//	        ,sortInfo:{field:'id',direction: 'DESC'}//指定排序字段
    });
    store.load();

    var grid = new Ext.grid.GridPanel({
        autoHeight: true,
        renderTo: 'grid',
        store: store,
        cm: cm,
//        autoExpandColumn:'descn'//指定某个列之id,grid就会在这一列自动扩展宽度,以填满空白的位置
        stripeRows: true, // 隔行换色
        viewConfig: {
            forceFit: true
        } //强制填充
        ,animCollapse:true
    });
    
   /** // 遍历 store
    for(var i=0;i<store.getCount();i++){
    	alert('store for:'+store.getAt(i).get('name'));
    }
    store.each(function(record){
    	alert('store.each:'+record.get('name'));
    });
//   指定获取范围
    var record = store.getRange(0,2);
    for(var i=0;i<record.length;i++){
    	alert('指定获取范围:'+record[i].get('name'));
    }
    **/
});





分享到:
评论

相关推荐

    extjs2----关于extjs 的使用,操作

    4. **数据绑定**:阐述ExtJS的数据模型(Store)和数据显示组件(Grid、Tree)之间的数据绑定机制,包括XML、JSON数据源的加载。 5. **表单元素**:深入探讨表单(Form)的创建,包括各种表单字段(TextField、...

    ExtJS--Windows.rar_extjs_extjs CSharp_extjs windows

    4. **ExtJS组件**:实现Windows风格的Web应用,会用到ExtJS的一些关键组件,例如: - `Window`:模拟Windows窗口,可以拖动、最大化、最小化和关闭。 - `Menu`和`MenuItem`:创建上下文菜单或主菜单,模拟Windows...

    Extjs--DWR做的动态树

    总的来说,"Extjs--DWR做的动态树"这个主题涉及到ExtJS的组件编程和DWR的远程调用技术,通过结合两者,可以创建出高度交互、响应迅速的Web界面。对于开发人员来说,理解这两个工具的集成是提升Web应用用户体验的重要...

    ExtJS笔记---Grid实现后台分页

    这篇“ExtJS笔记——Grid实现后台分页”探讨了如何在ExtJS的Grid组件中实现高效的后台分页功能。 后台分页是一种常见的数据处理策略,特别是在大数据量的情况下,它将数据分批加载,避免一次性加载所有记录导致的...

    extjs_4.1.0_community_extjs4-mvc-complex-dashboard.zip

    ExtJS 4.1.0 是一款流行的JavaScript框架,用于构建富客户端的Web应用程序。它提供了丰富的组件库、数据绑定机制、MVC架构以及强大的布局管理。社区版是开源的,允许开发者免费使用和定制,适合开发复杂的企业级应用...

    Extjs4---combobox省市区三级联动+struts2

    在这个特定的项目“Extjs4---combobox省市区三级联动+struts2”中,我们将探讨如何利用ExtJS 4的ComboBox组件实现省市区的三级联动效果,并结合Struts2框架进行数据交互。 首先,`ComboBox`是ExtJS中的一个组件,它...

    Extjs实战 --- 发布小纸条

    5. **ExtJS组件应用** - **Ext.grid.Panel**:用于显示小纸条列表,每个单元格可以包含纸条的内容、作者等信息。 - **Ext.form.Panel**:创建发布新纸条的表单,包含输入框、按钮等元素。 - **Ext.data.Store**:...

    Extjs4---grid的修改、删除功能---结合struts2、hibernate

    在本文中,我们将深入探讨如何在ExtJS 4框架中实现Grid组件的修改和删除功能,同时结合Struts2和Hibernate技术,构建一个完整的CRUD(创建、读取、更新、删除)应用。ExtJS 4是一个强大的JavaScript UI库,提供了...

    extjs4-export

    这通常是EXTJS4中的Grid面板的数据源,可以通过store获取。确保数据是干净且适合Excel格式的,例如,处理日期和数字格式。 2. **数据转换**:将数据转换成Excel可以理解的格式。这可能涉及到将数据转换为CSV(逗号...

    ExtJS3.1-3.3中文API文档.zip

    2. **组件(Components)**:ExtJS的核心在于其丰富的组件库,包括Grid、Panel、Form、Window、Toolbar等。这些组件是可复用的,具有高度定制性,可以构建出各种复杂的用户界面。 3. **布局(Layouts)**:布局管理...

    Extjs之--带分页的lovcombo控件

    同时,需要引入Ext.PagingToolbar组件,它会自动与store关联,显示分页按钮和信息。 3. 加载和查询逻辑:当用户输入关键词或切换分页时,LOV Combo需要向服务器发送请求获取对应的数据。这可以通过监听store的load...

    Extjs4-学习指南

    - **创建 Model 和 Store**:管理数据模型和数据存储。 - **通过 model 保存数据**:更新数据模型中的数据。 - **将数据保存到服务器**:使用 Ajax 技术实现客户端与服务器的交互。 ##### 3.3 布局和容器 - **容器...

    ExtJS-MVC-用户列表实例

    6. **应用程序(Application)**:在ExtJS MVC中,应用程序是所有组件、控制器、视图、模型和store的容器。它负责初始化和管理整个应用的生命周期。 在压缩包中的"ExtTreeTab"可能表示一个包含树形结构和选项卡功能...

    extjs-7.0.0-gpl

    7. **强大的数据管理**:通过Store和Proxy机制,ExtJS能轻松处理大量数据的加载、存储和分页,与后端API集成无缝,支持多种数据源,如JSON、XML等。 8. **路由和导航**:7.0.0版提供了强大的路由和导航系统,使得...

    ExtJS grid过滤操作

    ExtJS Grid是一个强大的数据展示组件,它允许用户以表格的形式查看和操作大量数据。在实际应用中,数据过滤是常见的需求,以便用户能快速定位到感兴趣的信息。本篇将深入探讨ExtJS Grid的过滤操作,以及如何动态地对...

    extjs动态生成model、store、panel

    extjs动态生成model、store、panel;sql拼接等多种技术难点

    storebar extjs通过store实现toolbar

    在EXTJS这个强大的JavaScript框架中,`Store`和`Toolbar`是两个核心组件,它们分别用于数据管理和用户界面的交互。本篇文章将深入探讨如何利用`Store`来实现`Toolbar`的功能,即所谓的`Storebar`,这在EXTJS开发中是...

    ExtJS-3.4.0系列目录

    **ExtJS-3.4.0系列目录** 在ExtJS框架中,3.4.0版本提供了丰富的组件和功能,...在实际开发中,开发者还可以结合Ajax、Store、Proxy等概念来处理异步数据,以及利用ExtJS的事件系统进行组件间的通信和响应用户的操作。

    Extjs树分页组件扩展

    在ExtJS中,树形(Tree)组件是一种用于展示层级数据的强大工具,它允许用户以树状结构浏览和操作数据。然而,在处理大量数据时,一次性加载所有节点可能导致页面响应变慢,这时就需要引入分页功能。"Extjs树分页...

Global site tag (gtag.js) - Google Analytics