extjs中的store
1.store中重要的属性和方法
属性:data、proxy、reader、url、root ....
方法:load
2.理解:data--原料,proxy--运输车,reader--加工厂,store--仓库。入库后等待给grid使用。
Ext.onReady(function(){
var PersonRecord = Ext.data.Record.create([
{name: 'name', type: 'string'},
{name: 'sex', type: 'int'}
]); var data = [
['boy', 0],
['girl', 1]
]; var store = new Ext.data.Store({ //使用Store时要配置proxy,和reader
proxy: new Ext.data.MemoryProxy(data),
reader: new Ext.data.ArrayReader({}, PersonRecord)
});
store.load(); var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{header: 'name', dataIndex: 'name'},
{header: 'sex', dataInex: 'sex'}
],
autoHeight: true,
renderTo: 'grid'
}); });
3.SimpleStore = Store + MemoryProxy + ArrayReader.
4.JsonStore = Store + HttpProxy + JsonReader.
5.如果配置了data,则proxy和url无效,且不需要调用load方法来生成Record集合
var ds = new Ext.data.SimpleStore({
data: [
['id1','name1','descn1'],
['id2','name2','descn2']
],
fields: ['id','name','descn']
});
6.如果没有配置data,则必须设置proxy或url,或两者都设置。此时,如果没有将autoLoad设置为true,那么需要手动进行load方法的调用。
<script type="text/javascript">
Ext.onReady(function(){ var store = new Ext.data.JsonStore({
autoDestory:true,
data:{ 'results': 2, 'rows': [
{ 'id': 1, 'name': 'Bill', occupation: 'Gardener' },
{ 'id': 2, 'name': 'Ben', occupation: 'Horticulturalist' }
]},
storeId: 'storeId01',
root:"rows",
fields: [
{name: 'id', mapping:'id'},
{name: 'name', mapping:'name'},
{name: 'occupation', mapping:'occupation'},
]
}); var grid = new Ext.grid.GridPanel({
renderTo: 'grid',
autoHeight: true,
store: store,
columns: [
{header: "id", width: 200, sortable: true,dataIndex: 'id'},
{header: "name", width: 200, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 200,sortable: true, dataIndex: 'occupation'}
],
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: store,
displayInfo: true,
displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
emptyMsg: "没有记录"
})
});
store.load(); });
</script>
extjs中的store的更多相关文章
- Extjs中Store小总结
http://blog.csdn.net/without0815/article/details/7798170 1.什么是store? Store类似于一个本地仓库(即数据存储器),包括有 Arra ...
- EXTJS中grid的数据特殊显示,不同窗口的数据传递
//EXTJS中grid的数据特殊显示renderer : function(value, metaData, record, rowIndex, colIndex, store, view) { v ...
- [转]ExtJS之遍历Store
原文地址:http://blog.sina.com.cn/s/blog_67cc6e7d0100ox6u.html ExtJS中,一般很少需要遍历Store,因为它的selectModel很好用,无论 ...
- Extjs中给同一个GridPanel中的事件添加参数的方法
Extjs中给同一个GridPanel中的事件添加参数的方法: this.isUse = new Ext.Action({ text:'启用', scope ...
- extjs中的下载并对文件重命名功能的实现
在小白的学习extjs的过程中,如果需要了解多文件的上传功能,也可以查看小白的上篇随笔,希望给大家帮助.http://www.cnblogs.com/wangqc/p/extjsFileUpload. ...
- 转: ExtJS中xtype一览
转: ExtJS中xtype一览 基本组件: xtype Class 描述 button Ext.Button 按钮 splitbutton Ext.SplitButton 带下拉菜单的按钮 cycl ...
- extjs中第一次访问有效,第二次访问出现部分组件无法显示的,动态改变组件的label值的方法,ExtJs中组件最好少使用ID属性(推荐更多使用Name属性)
在公司做的一个OA项目中,曾经就遇到了这样的一个问题:(我是在jsp中的div中将js render到div中去的)第一次访问此界面的时候,formpanel上的组件能正常显示,不刷新整个页面的前提下 ...
- Extjs4中的store
Extjs 4引入新的数据包,其中新增了不少新类并对旧有的类作出了修整.使数据包更强大和更容易使用. 本章我们将学习一下内容: 2.1. 概述新特性 Extjs4的数据包引入了如Mod ...
- extJS 中 ext.data 介绍
ext.data 最主要的功能是获取和组织数据结构,并和特定控件联系起来,于是,Ext.data成了数据的来源,负责显示数据. Ext.data在命名空间中定义了一系列store.reader和pro ...
随机推荐
- DDMS调试信息
1.可以使用System.out.println() 2.android.util包下的Log类 该类可以将信息以日志的形式输出到LogCat中: import android.util.Log; S ...
- flask获取传入参数的两种方式
#coding=utf-8 from flask import Flask from flask import request app = Flask(__name__) @app.route(&qu ...
- 使用js是想防止表单重复提交的效果
直接上代码: <html> <head> <title>Form表单</title> <script type="text/javasc ...
- iOS - UITextView在调用textViewDidChange方法,九宫格相关中文输入的问题
问题一 iOS textView在调用 UITextViewDelegate 的 textViewDidChange方法,九宫格相关中文输入的问题 有时候,需要在textViewDidChange处理 ...
- 转 Mysql性能优化教程
Mysql性能优化教程 背景及目标 厦门游家公司(4399.com)用于员工培训和分享. 针对用户群为已经使用过mysql环境,并有一定开发经验的工程师 针对高并发,海量数据的互联网环境. 本文语言为 ...
- vue案例 - v-model实现自定义样式の多选与单选
接,上文:https://www.cnblogs.com/padding1015/p/9265985.html 这两天在玩mpvue,但是下午如果对着文档大眼瞪小眼的话,肯定会睡着的. 想起昨晚的fl ...
- path 与classpath针对JAVA来说
Path 路径,是java编译时需要调用的程序(如java,javac等)所在的地方CLASSPATH 类的路径,在编译运行java程序时,如果有调用到其他类的时候,在classpath中寻找需要的类 ...
- Android org.apache.http.*找不到
https://blog.csdn.net/u012005313/article/details/51499892 直接把 org.apache.http.legacy.jar 报拷贝出来,放到Ecl ...
- Excel 2010 得到当天的日期/得到一年中的第几周/得到当前一周中的星期几
=TODAY() ="第"&WEEKNUM(TODAY())&"周" =TEXT(TODAY(),"aaaa") Ctrl ...
- key是数字的对象集合
整理如下: let data = {3: '影视', 4: '音乐', 5: '广场舞', 6: '游戏', 7: '综艺', 8: '动漫', 9: '翻唱', 10: '生活', 11: '美食' ...