• ExtJs4学习(七)MVC中的Store


    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')


  • 相关阅读:
    【Vue前端】Vue前端注册业务实现!!!【代码】
    QQ第三方登录逻辑(微信,微博等同)
    发送短信验证码逻辑
    web图形验证码逻辑
    PID算法资料【视频+PDF介绍】
    如何配置电脑本地的域名
    js实现阻止默认事件preventDefault与returnValue
    js实现事件监听与阻止监听传播
    json字符串转换对象的方法1
    json字符串转换对象的方法
  • 原文地址:https://www.cnblogs.com/love-omnus/p/4196563.html
Copyright © 2020-2023  润新知