zoukankan      html  css  js  c++  java

  • extjs4 数据实体模型

    1、创建Ext.data.Model数据实体模型

    Javascript代码 复制代码 收藏代码
    1. //注册用户数据模型User   
    2. Ext.regModel('User', {   
    3.     fields: [//定义模型字段   
    4.         {name: 'name',  type: 'string'},   
    5.         {name: 'age',   type: 'int'},   
    6.         {name: 'phone', type: 'string'}   
    7.     ]   
    8. });   
    9. //创建User模型的实体对象   
    10. var user = Ext.ModelMgr.create({   
    11.     name : 'tom',   
    12.     age  : 24,   
    13.     phone: '555-555-5555'  
    14. }, 'User');   
    15. //获取员工姓名   
    16. alert(user.get('name'));  
    //注册用户数据模型User
Ext.regModel('User', {
    fields: [//定义模型字段
        {name: 'name',  type: 'string'},
        {name: 'age',   type: 'int'},
        {name: 'phone', type: 'string'}
    ]
});
//创建User模型的实体对象
var user = Ext.ModelMgr.create({
    name : 'tom',
    age  : 24,
    phone: '555-555-5555'
}, 'User');
//获取员工姓名
alert(user.get('name'));



    2、在模型中进行数据验证

    Javascript代码 复制代码 收藏代码
    1. //定义默认的验证提示信息   
    2. Ext.data.validations.presenceMessage = '必须是有效值。';   
    3. Ext.data.validations.lengthMessage = '长度错误。';   
    4. Ext.data.validations.formatMessage = '格式错误。';   
    5. Ext.data.validations.inclusionMessage = '没有包括在可接受的数据中。';   
    6. Ext.data.validations.exclusionMessage = '不是可接受的值。';   
    7.   
    8. //自定义数值范围验证   
    9. Ext.apply(Ext.data.validations,{   
    10.     number : function(config, value){   
    11.         if (value === undefined) {   
    12.             return false;   
    13.         }   
    14.         var min    = config.min,   
    15.             max    = config.max;   
    16.        
    17.         if ((min && value < min) || (max && value > max)) {   
    18.             return false;   
    19.         } else {   
    20.             return true;   
    21.         }   
    22.     },   
    23.     numberMessage : '数值范围错误。'  
    24. });   
    25.   
    26. //注册用户数据模型User   
    27. Ext.regModel('User', {   
    28.     fields: [//定义模型字段   
    29.          {name: 'name',     type: 'string'},   
    30.          {name: 'age',      type: 'int'},   
    31.          {name: 'phone',    type: 'string'},   
    32.          {name: 'gender',   type: 'string'},   
    33.          {name: 'username', type: 'string'},   
    34.          {name: 'alive',    type: 'boolean', defaultValue: true}   
    35.     ],   
    36.     validations: [   
    37.         {type: 'presence',  field: 'age'},   
    38.         {type: 'number',  field: 'age', min : 30},   
    39.         {type: 'length',    field: 'name', min: 2},   
    40.         {type: 'inclusion', field: 'gender',   list: ['男', '女']},   
    41.         {type: 'exclusion', field: 'username', list: ['admin@xx.xx', 'user@xx.xx']},   
    42.         {type: 'format',    field: 'username',   
    43.             //校验用户名是否为电子邮件格式   
    44.             matcher: /^([\w]+)(.[\w]+)*@([\w-]+\.){1,5}([A-Za-z]){2,4}$/   
    45.         }   
    46.     ]   
    47. });   
    48. //创建User模型的实体对象   
    49. var user = Ext.ModelMgr.create({   
    50.     name : 'tom',   
    51.     age  : 24,   
    52.     gender : 'man',   
    53.     username: 'abc'  
    54. }, 'User');   
    55. //执行数据验证   
    56. var errors = user.validate();   
    57. //获取验证信息   
    58. var message = [];   
    59. errors.each(function(v){   
    60.     message.push(v.field+' : '+v.message)   
    61. });   
    62. alert(message.join('\n'));  
    //定义默认的验证提示信息
Ext.data.validations.presenceMessage = '必须是有效值。';
Ext.data.validations.lengthMessage = '长度错误。';
Ext.data.validations.formatMessage = '格式错误。';
Ext.data.validations.inclusionMessage = '没有包括在可接受的数据中。';
Ext.data.validations.exclusionMessage = '不是可接受的值。';

//自定义数值范围验证
Ext.apply(Ext.data.validations,{
	number : function(config, value){
		if (value === undefined) {
            return false;
        }
        var min    = config.min,
            max    = config.max;
    
        if ((min && value < min) || (max && value > max)) {
            return false;
        } else {
            return true;
        }
	},
	numberMessage : '数值范围错误。'
});

//注册用户数据模型User
Ext.regModel('User', {
    fields: [//定义模型字段
         {name: 'name',     type: 'string'},
         {name: 'age',      type: 'int'},
         {name: 'phone',    type: 'string'},
         {name: 'gender',   type: 'string'},
         {name: 'username', type: 'string'},
         {name: 'alive',    type: 'boolean', defaultValue: true}
    ],
    validations: [
        {type: 'presence',  field: 'age'},
        {type: 'number',  field: 'age', min : 30},
        {type: 'length',    field: 'name', min: 2},
        {type: 'inclusion', field: 'gender',   list: ['男', '女']},
        {type: 'exclusion', field: 'username', list: ['admin@xx.xx', 'user@xx.xx']},
        {type: 'format',    field: 'username',
        	//校验用户名是否为电子邮件格式
        	matcher: /^([\w]+)(.[\w]+)*@([\w-]+\.){1,5}([A-Za-z]){2,4}$/
        }
    ]
});
//创建User模型的实体对象
var user = Ext.ModelMgr.create({
    name : 'tom',
    age  : 24,
    gender : 'man',
    username: 'abc'
}, 'User');
//执行数据验证
var errors = user.validate();
//获取验证信息
var message = [];
errors.each(function(v){
	message.push(v.field+' : '+v.message)
});
alert(message.join('\n'));



    3、在模型中通过代理加载数据

    Javascript代码 复制代码 收藏代码
    1. //注册用户数据模型User   
    2. Ext.regModel('User', {   
    3.     fields: [//定义模型字段   
    4.             {name: 'name', type: 'string'},   
    5.             {name: 'age', type: 'int'},   
    6.             {name: 'id', type: 'int'}   
    7.     ],   
    8.     //配置数据代理   
    9.     proxy: {   
    10.         type : 'ajax',   
    11.         url : 'userServer.jsp'  
    12.     }   
    13. });   
    14. var user = Ext.ModelManager.getModel('User');   
    15. //通过代理读取数据   
    16. user.load(1, {   
    17.     success: function(rec) {   
    18.         alert(rec.get('name'));   
    19.     }   
    20. });  
    //注册用户数据模型User
Ext.regModel('User', {
    fields: [//定义模型字段
            {name: 'name', type: 'string'},
            {name: 'age', type: 'int'},
            {name: 'id', type: 'int'}
    ],
    //配置数据代理
    proxy: {
    	type : 'ajax',
        url : 'userServer.jsp'
    }
});
var user = Ext.ModelManager.getModel('User');
//通过代理读取数据
user.load(1, {
    success: function(rec) {
    	alert(rec.get('name'));
    }
});
    Jsp代码 复制代码 收藏代码
    1. <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>   
    2. <%@ page import="java.util.*" %>   
    3. <%   
    4. String userId = request.getParameter("id");   
    5. response.setContentType("application/json;charset=UTF-8");   
    6. response.getWriter().write("{id : "+userId+", name: 'user"+userId+"'}");   
    7. %>  
    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="java.util.*" %>
<%
String userId = request.getParameter("id");
response.setContentType("application/json;charset=UTF-8");
response.getWriter().write("{id : "+userId+", name: 'user"+userId+"'}");
%>



    4、模型间的一对多关系

    Javascript代码 复制代码 收藏代码
    1. //注册用户数据模型User   
    2. Ext.regModel('User', {   
    3.     fields: [//定义模型字段   
    4.             {name: 'name', type: 'string'},//用户名称   
    5.             {name: 'id', type: 'int'}//用户id   
    6.     ],   
    7.     //User与Product是一对多关系   
    8.     hasMany: {model: 'Product', name:'getProducts',autoLoad : false},   
    9.     proxy: {   
    10.         type : 'ajax',    
    11.         url : 'userServer.jsp'  
    12.     }   
    13. });   
    14. //注册产品数据模型Product   
    15. Ext.regModel('Product', {   
    16.     fields: [//定义模型字段   
    17.             {name: 'id', type: 'int'},//产品id   
    18.             {name: 'title', type: 'string'},//产品名称   
    19.             {name: 'user_id', type: 'int'}//用户id   
    20.     ],   
    21.     proxy: {   
    22.         type : 'ajax',   
    23.         url : 'ProductServer1.jsp',   
    24.         reader: {   
    25.             type: 'json',   
    26.             root: 'products'  
    27.         }   
    28.     }   
    29. });   
    30. //创建User实例   
    31. var user = Ext.ModelManager.getModel('User');   
    32. //读取id为1的User实例   
    33. user.load(1, {   
    34.     success: function(rec) {   
    35.         //获取user_id为1的产品Store   
    36.         var products = rec.getProducts();   
    37.         //加载user_id为1的产品数据   
    38.         products.load({   
    39.             callback : function(records, operation, success){   
    40.                 var msg = [];   
    41.                 for(var i = 0; i < records.length; i++){   
    42.                     var rec = records[i];   
    43.                     msg.push('产品名称：'+rec.get('title')+' 用户id：'+rec.get('user_id'));   
    44.                 }   
    45.                 alert(msg.join('\n'));   
    46.             }   
    47.         });   
    48.     }   
    49. });  
    //注册用户数据模型User
Ext.regModel('User', {
    fields: [//定义模型字段
            {name: 'name', type: 'string'},//用户名称
            {name: 'id', type: 'int'}//用户id
    ],
    //User与Product是一对多关系
    hasMany: {model: 'Product', name:'getProducts',autoLoad : false},
    proxy: {
    	type : 'ajax', 
        url : 'userServer.jsp'
    }
});
//注册产品数据模型Product
Ext.regModel('Product', {
    fields: [//定义模型字段
            {name: 'id', type: 'int'},//产品id
            {name: 'title', type: 'string'},//产品名称
            {name: 'user_id', type: 'int'}//用户id
    ],
    proxy: {
    	type : 'ajax',
        url : 'ProductServer1.jsp',
	    reader: {
            type: 'json',
            root: 'products'
        }
    }
});
//创建User实例
var user = Ext.ModelManager.getModel('User');
//读取id为1的User实例
user.load(1, {
    success: function(rec) {
    	//获取user_id为1的产品Store
    	var products = rec.getProducts();
    	//加载user_id为1的产品数据
    	products.load({
    		callback : function(records, operation, success){
    			var msg = [];
    			for(var i = 0; i < records.length; i++){
    				var rec = records[i];
    				msg.push('产品名称：'+rec.get('title')+' 用户id：'+rec.get('user_id'));
    			}
    			alert(msg.join('\n'));
    		}
    	});
    }
});

    ProductServer1.jsp

    Jsp代码 复制代码 收藏代码
    1. <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>   
    2. <%@ page import="net.sf.json.JSONObject" %>   
    3. <%@ page import="net.sf.json.JSONArray" %>   
    4. <%   
    5. String filter = request.getParameter("filter");   
    6. JSONArray filters = JSONArray.fromObject(filter);   
    7. int userId = filters.getJSONObject(0).getInt("value");   
    8. response.setContentType("application/json;charset=UTF-8");   
    9. String result = "{products:[{id : 1, title: '产品1', user_id : "+userId+"}, {id : 2, title: '产品2', user_id : "+userId+"}]}";   
    10. System.out.println("result="+result);   
    11. response.getWriter().write(result);   
    12. %>  
    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="net.sf.json.JSONObject" %>
<%@ page import="net.sf.json.JSONArray" %>
<%
String filter = request.getParameter("filter");
JSONArray filters = JSONArray.fromObject(filter);
int userId = filters.getJSONObject(0).getInt("value");
response.setContentType("application/json;charset=UTF-8");
String result = "{products:[{id : 1, title: '产品1', user_id : "+userId+"}, {id : 2, title: '产品2', user_id : "+userId+"}]}";
System.out.println("result="+result);
response.getWriter().write(result);
%>



    5、模型间的多对一关系

    Javascript代码 复制代码 收藏代码
    1. //注册分类数据模型Category   
    2. Ext.regModel('Category', {   
    3.     fields: [//定义模型字段   
    4.             {name: 'type', type: 'string'},//产品类型名称   
    5.             {name: 'id', type: 'int'}//产品类型id   
    6.     ],   
    7.     proxy: {   
    8.         type : 'ajax',    
    9.         url : 'CategoryServer.jsp'  
    10.     }   
    11. });   
    12. //注册产品数据模型Product   
    13. Ext.regModel('Product', {   
    14.     fields: [//定义模型字段   
    15.             {name: 'id', type: 'int'},//产品id   
    16.             {name: 'title', type: 'string'},//产品名称   
    17.             {name: 'category_id', type: 'int'}//用户id   
    18.     ],   
    19.     belongsTo : 'Category'  
    20. });   
    21. //创建product实例   
    22. var product = new Product({   
    23.     id: 100,   
    24.     category_id: 1,   
    25.     title: '产品1'  
    26. });   
    27. product.getCategory(function(category, operation){   
    28.     //获取类型名称   
    29.     alert(category.get('type'));   
    30. });  
    //注册分类数据模型Category
Ext.regModel('Category', {
    fields: [//定义模型字段
            {name: 'type', type: 'string'},//产品类型名称
            {name: 'id', type: 'int'}//产品类型id
    ],
    proxy: {
    	type : 'ajax', 
        url : 'CategoryServer.jsp'
    }
});
//注册产品数据模型Product
Ext.regModel('Product', {
    fields: [//定义模型字段
            {name: 'id', type: 'int'},//产品id
            {name: 'title', type: 'string'},//产品名称
            {name: 'category_id', type: 'int'}//用户id
    ],
    belongsTo : 'Category'
});
//创建product实例
var product = new Product({
    id: 100,
    category_id: 1,
    title: '产品1'
});
product.getCategory(function(category, operation){
	//获取类型名称
	alert(category.get('type'));
});
    Jsp代码 复制代码 收藏代码
    1. <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>   
    2. <%   
    3. String categoryId = request.getParameter("id");   
    4. response.setContentType("application/json;charset=UTF-8");   
    5. response.getWriter().write("{id : "+categoryId+", type: '产品类型"+categoryId+"'}");   
    6. %>  
    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
String categoryId = request.getParameter("id");
response.setContentType("application/json;charset=UTF-8");
response.getWriter().write("{id : "+categoryId+", type: '产品类型"+categoryId+"'}");
%>



    6、Ext.data.proxy.Memory示例

    Javascript代码 复制代码 收藏代码
    1. //创建数据模型   
    2. Ext.regModel('User', {   
    3.     fields: ['id','name','age']   
    4. });   
    5.   
    6. //定义内存数据变量   
    7. var userData = {   
    8.     users : [   
    9.         { id: 1, name: '张三', age: 20 },   
    10.         { id: 2, name: '李四', age: 30 },   
    11.         { id: 3, name: '王五', age: 40 }   
    12.     ]   
    13. };     
    14.   
    15. //创建memory代理   
    16. var memoryProxy = new Ext.data.proxy.Memory({   
    17.     model : 'User',   
    18.     reader: {   
    19.         root: 'users'  
    20.     },   
    21.     data : userData   
    22. });            
    23.   
    24. //读取数据   
    25. memoryProxy.read(new Ext.data.Operation(), callBack)   
    26. //数据读取之后的回调函数   
    27. function callBack(result){      //load方法的回调函数   
    28.     var totalRecords = result.resultSet.total;   
    29.     alert('读取内存数据，记录总是：'+totalRecords);   
    30. }  
    //创建数据模型
Ext.regModel('User', {
    fields: ['id','name','age']
});

//定义内存数据变量
var userData = {
    users : [
        { id: 1, name: '张三', age: 20 },
        { id: 2, name: '李四', age: 30 },
        { id: 3, name: '王五', age: 40 }
    ]
};	

//创建memory代理
var memoryProxy = new Ext.data.proxy.Memory({
	model : 'User',
	reader: {
        root: 'users'
    },
	data : userData
}); 		

//读取数据
memoryProxy.read(new Ext.data.Operation(), callBack)
//数据读取之后的回调函数
function callBack(result){ 		//load方法的回调函数
	var totalRecords = result.resultSet.total;
	alert('读取内存数据，记录总是：'+totalRecords);
}



    7、Ext.data.proxy.Ajax示例

    Javascript代码 复制代码 收藏代码
    1. //创建数据模型   
    2. Ext.regModel('Person', {   
    3.     fields: ['name','age']   
    4. });   
    5. //创建Ajax代理   
    6. var ajaxProxy = new Ext.data.proxy.Ajax({   
    7.     url : 'personServer.jsp',   
    8.     model: 'Person',   
    9.     reader: 'json'  
    10. });   
    11. //创建请求参数对象   
    12. var operation = new Ext.data.Operation({   
    13.     action: 'read'//设置请求动作为read   
    14. });   
    15. //读取数据   
    16. ajaxProxy.doRequest(operation,callBack);   
    17. //doRequest方法的回调函数   
    18. function callBack(operation){   
    19.     //获取原始响应数据   
    20.     var responseText = operation.response.responseText;   
    21.     //获得记录总数   
    22.     var totalRecords = operation.resultSet.totalRecords;   
    23.     //获得记录数组   
    24.     var records = operation.resultSet.records;   
    25.        
    26.     alert('使用Ajax代理读取远程数据，记录总是：'+totalRecords);   
    27. }  
    //创建数据模型
Ext.regModel('Person', {
    fields: ['name','age']
});
//创建Ajax代理
var ajaxProxy = new Ext.data.proxy.Ajax({
	url : 'personServer.jsp',
	model: 'Person',
    reader: 'json'
});
//创建请求参数对象
var operation = new Ext.data.Operation({
    action: 'read'//设置请求动作为read
});
//读取数据
ajaxProxy.doRequest(operation,callBack);
//doRequest方法的回调函数
function callBack(operation){
	//获取原始响应数据
	var responseText = operation.response.responseText;
	//获得记录总数
	var totalRecords = operation.resultSet.totalRecords;
	//获得记录数组
	var records = operation.resultSet.records;
	
	alert('使用Ajax代理读取远程数据，记录总是：'+totalRecords);
}
    Jsp代码 复制代码 收藏代码
    1. <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>   
    2. <%   
    3.     response.setContentType("application/json;charset=UTF-8");   
    4.     String result = "[{name: '张三', age : 20}, {name: '李四', age : 30}]";   
    5.     response.getWriter().write(result);   
    6. %>  
    <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
	response.setContentType("application/json;charset=UTF-8");
	String result = "[{name: '张三', age : 20}, {name: '李四', age : 30}]";
	response.getWriter().write(result);
%>



    8、Ext.data.reader.Json示例

    Javascript代码 复制代码 收藏代码
    1. //JSON格式的用户及订单信息   
    2. var userData = {   
    3.     "total" : 2000,   
    4.     "users": [{   
    5.         "id": 123,   
    6.         "name": "张三",   
    7.         "orders": [{   
    8.             "id": 50,   
    9.             "total" : 100   
    10.         }]   
    11.     }]   
    12. }   
    13. //定义用户User模型   
    14. Ext.regModel("User", {   
    15.     fields: [ 'id', 'name' ],   
    16.     hasMany: 'Order'//定义User与Order之间的一对多关系   
    17. });   
    18. //定义订单Order模型   
    19. Ext.regModel("Order", {   
    20.     fields: [ 'id', 'total' ],   
    21.     belongsTo: 'User'//定义Order与User之间的多对一关系   
    22. });   
    23.   
    24. //创建memory代理   
    25. var memoryProxy = new Ext.data.proxy.Memory({   
    26.     model : 'User',   
    27.     reader: {   
    28.         type: 'json',//Ext.data.reader.Json读取器   
    29.         root: 'users'  
    30.     },   
    31.     data : userData   
    32. });    
    33. //读取数据   
    34. memoryProxy.read(new Ext.data.Operation(), callBack)   
    35. //数据读取之后的回调函数   
    36. function callBack(result){   
    37.     //获取总记录数   
    38.     var count = result.resultSet.total;   
    39.     //获取第一个用户信息   
    40.     var user = result.resultSet.records[0];   
    41.     //获取该用户的第一个账单信息   
    42.     var order = user.orders().getAt(0);   
    43.     alert('总记录数：'+count+   
    44.           '\n姓名：'+user.get('name')+   
    45.           '\n账单金额：'+order.get('total'));   
    46. }  
    //JSON格式的用户及订单信息
var userData = {
	"total" : 2000,
	"users": [{
		"id": 123,
		"name": "张三",
		"orders": [{
			"id": 50,
			"total" : 100
		}]
	}]
}
//定义用户User模型
Ext.regModel("User", {
    fields: [ 'id', 'name' ],
    hasMany: 'Order'//定义User与Order之间的一对多关系
});
//定义订单Order模型
Ext.regModel("Order", {
    fields: [ 'id', 'total' ],
    belongsTo: 'User'//定义Order与User之间的多对一关系
});

//创建memory代理
var memoryProxy = new Ext.data.proxy.Memory({
	model : 'User',
	reader: {
        type: 'json',//Ext.data.reader.Json读取器
        root: 'users'
    },
	data : userData
}); 
//读取数据
memoryProxy.read(new Ext.data.Operation(), callBack)
//数据读取之后的回调函数
function callBack(result){
	//获取总记录数
	var count = result.resultSet.total;
	//获取第一个用户信息
	var user = result.resultSet.records[0];
	//获取该用户的第一个账单信息
	var order = user.orders().getAt(0);
	alert('总记录数：'+count+
		  '\n姓名：'+user.get('name')+
		  '\n账单金额：'+order.get('total'));
}



    9、读取复杂的JSON数据

    Javascript代码 复制代码 收藏代码
    1. //JSON格式的用户及订单信息   
    2. var userData = {   
    3.     "users": [{   
    4.         "searchDate" : "2011-04-24",//查询时间   
    5.         "role" : "admin",//查询人角色   
    6.         "info" : {   
    7.             "id": 123,   
    8.             "name": "张三"  
    9.         }   
    10.     }]   
    11. }   
    12. //定义用户User模型   
    13. Ext.regModel("User", {   
    14.     fields: [ 'id', 'name' ]   
    15. });   
    16.   
    17. //创建memory代理   
    18. var memoryProxy = new Ext.data.proxy.Memory({   
    19.     model : 'User',   
    20.     reader: {   
    21.         type: 'json',//Ext.data.reader.Json读取器   
    22.         root: 'users',   
    23.         record : 'info'//定位有效数据的位置   
    24.     },   
    25.     data : userData   
    26. });    
    27. //读取数据   
    28. memoryProxy.read(new Ext.data.Operation(), callBack)   
    29. //数据读取之后的回调函数   
    30. function callBack(result){   
    31.     //获取第一个用户信息   
    32.     var user = result.resultSet.records[0];   
    33.     alert('姓名：'+user.get('name'));   
    34. }  
    //JSON格式的用户及订单信息
var userData = {
	"users": [{
		"searchDate" : "2011-04-24",//查询时间
		"role" : "admin",//查询人角色
		"info" : {
			"id": 123,
			"name": "张三"
		}
	}]
}
//定义用户User模型
Ext.regModel("User", {
    fields: [ 'id', 'name' ]
});

//创建memory代理
var memoryProxy = new Ext.data.proxy.Memory({
	model : 'User',
	reader: {
        type: 'json',//Ext.data.reader.Json读取器
        root: 'users',
        record : 'info'//定位有效数据的位置
    },
	data : userData
}); 
//读取数据
memoryProxy.read(new Ext.data.Operation(), callBack)
//数据读取之后的回调函数
function callBack(result){
	//获取第一个用户信息
	var user = result.resultSet.records[0];
	alert('姓名：'+user.get('name'));
}



    10、Ext.data.Store示例

    Javascript代码 复制代码 收藏代码
    1. //定义用户User模型   
    2. Ext.regModel("User", {   
    3.     fields: ['name', 'age' ],   
    4.     proxy: {   
    5.         type: 'memory'  
    6.     }   
    7. });   
    8. //创建数据集对象   
    9. var myStore = new Ext.data.Store({   
    10.     autoLoad: true,   
    11.     data : [{name: '张三', age : 20},    
    12.             {name: '李四', age : 30}],   
    13.     model: 'User'  
    14. });   
    15. //遍历Store中的记录   
    16. var msg = ['遍历Store中的记录：'];   
    17. myStore.each(function(rec){   
    18.     msg.push('姓名:'+rec.get('name')+' 年龄:'+rec.get('age'));   
    19. });   
    20. alert(msg.join('\n'));  
    //定义用户User模型
Ext.regModel("User", {
    fields: ['name', 'age' ],
    proxy: {
        type: 'memory'
    }
});
//创建数据集对象
var myStore = new Ext.data.Store({
	autoLoad: true,
	data : [{name: '张三', age : 20}, 
            {name: '李四', age : 30}],
    model: 'User'
});
//遍历Store中的记录
var msg = ['遍历Store中的记录：'];
myStore.each(function(rec){
	msg.push('姓名:'+rec.get('name')+' 年龄:'+rec.get('age'));
});
alert(msg.join('\n'));



    11、Ext.data.ArrayStore示例

    Javascript代码 复制代码 收藏代码
    1. //定义用户User模型   
    2. Ext.regModel("User", {   
    3.     fields: ['name', 'age' ],   
    4.     proxy: 'memory'  
    5. });   
    6. //创建ArrayStore数据集对象   
    7. var myStore = new Ext.data.ArrayStore({   
    8.     autoLoad: true,   
    9.     data : [['张三',20],['李四',30]],//数组数据   
    10.     model: 'User'  
    11. });   
    12. //遍历Store中的记录   
    13. var msg = ['遍历ArrayStore中的记录：'];   
    14. myStore.each(function(rec){   
    15.     msg.push('姓名:'+rec.get('name')+' 年龄:'+rec.get('age'));   
    16. });   
    17. alert(msg.join('\n'));  
  • 相关阅读:
    Java实现数字密码发生器
    Java实现夺冠概率模拟
    Java实现夺冠概率模拟
    Java实现夺冠概率模拟
    java 消息机制 ActiveMQ入门实例
    关于Java String 类型转换时null的问题(转)
    实现quartz定时器及quartz定时器原理介绍（转）
    spring 定时任务的 执行时间设置规则
    Spring与Quartz的整合实现定时任务调度（转）
    python开源项目及示例代码（转）
  • 原文地址：https://www.cnblogs.com/luluping/p/2243775.html
Copyright © 2011-2022 走看看