ExtJs4学习(七)MVC中的Store

来源:互联网 发布:魔兽世界mac 编辑:程序博客网 时间:2024/06/08 10:59

Ext.data.Store是extjs中用来进行数据交换和数据交互的标准中间件,无论是Grid还是ComboBox,都是通过它 实现数据读取、类型转换、排序分页和搜索等操作的。

Ext.define('User', {    extend: 'Ext.data.Model',    fields: [        {name: 'loginname', type: 'string'},        {name: 'ip',  type: 'string'}    ]});

Store既可以从本地数组中读取数据,也可以从服务器远程读取数据,当然还可以服务器代理读取,这些都得靠proxy实现,至于还有哪些区分,以及实现方式将再下一节阐述

为了更好的说清楚Store的用法,我们做如下例子

var store = Ext.create('Ext.data.Store', {    model: 'User',    proxy: {        type: 'memory',        data:[{loginname:'admin',ip:'192.168.1.2'},{loginname:'guest',ip:'192.168.1.5'}]    },    //autoLoad:true//配置了此项,表明数据集自动加载});
一些常用方法

//加载数据store.load();//添加数据store.add({loginname:'administrator.com',ip:'192.168.1.8'});//读取数据store.each(function(record){console.info(record.get('loginname'));alert(record.get('loginname'));});//过滤//store.filter("loginname", /\.com$/);根据单个属性域(field)过滤:store.filter([              {property: "loginname", value: /\.com$/},              {filterFn: function(item) { return item.get("ip") == '192.168.1.5'; }}]);//查找某条记录var record = store.find('loginname','guest');//获取store中第一条记录的快捷方法.var record = store.first();//获取指定index处的记录var record = store.getAt(2);//获取store中记录的数量var count = store.getCount;//获取store中最后一条记录的快捷方法var record = store.last();

后台读取数据

var store = Ext.create('Ext.data.Store', {    model: 'User',    pageSize:5,//每页显示条数,默认25    proxy: {        type: 'ajax',        url: 'jsonServer.jsp',        reader: {            type: 'json',            root: 'rows',            totalProperty: 'total'        },        writer: {type: 'json'}    }});

怎么获取数据

store.load({scope: this,    callback: function(records, operation, success) {    //获取总记录数    //console.info(store.getCount());这个来源于对记录的统计    console.info(store.getTotalCount());//这个来源于后台传过来的total    //获取当前页    console.info(store.currentPage);    Ext.each(records,function(record){    console.info(record.get('loginname'));    })    }});//显示第二页数据store.loadPage(2);//显示上一页数据store.previousPage();//显示下一页数据store.nextPage();

后台数据,我以jsp的形式提供

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%><%String[] persons = new String[10];persons[0] = "{loginname : 'tom' , ip : '192.168.1.1'}";persons[1] = "{loginname : 'jack' , ip : '192.168.1.2'}";persons[2] = "{loginname : 'mary' , ip : '192.168.1.3'}";persons[3] = "{loginname : 'jone' , ip : '192.168.1.4'}";persons[4] = "{loginname : 'ada' , ip : '192.168.1.5'}";persons[5] = "{loginname : 'alex' , ip : '192.168.1.6'}";persons[6] = "{loginname : 'lucy' , ip : '192.168.1.7'}";persons[7] = "{loginname : 'jms' , ip : '192.168.1.8'}";persons[8] = "{loginname : 'smile' , ip : '192.168.1.9'}";persons[9] = "{loginname : 'somnus' , ip : '192.168.1.10'}";int pageSize = Integer.parseInt(request.getParameter("page").toString());int limit = Integer.parseInt(request.getParameter("limit").toString());System.out.println("pageSize="+pageSize+ " limit="+limit);StringBuffer personName = new StringBuffer();personName.append("{");personName.append("total : 10,");personName.append("rows : [");int min = (pageSize-1)*limit;int max = pageSize*limit;if(max > 10){max = 10;}for(int i = min ; i < max ; i++){personName.append(persons[i]);if(i < max - 1){personName.append(",");}};personName.append("]");personName.append("}");response.getWriter().write(personName.toString());%>


最后介绍一个Store的一个属性:storeId

当前store对象的唯一标识ID. 当此值存在时, 当前Store将被注册到Ext.data.StoreManager中, 从而可以在别处轻松创建.

获取方式 

var store = Ext.data.StoreManager.lookup('simpsonsStore')


1 0
原创粉丝点击