extjs JSONStore的load事件/insert,add方法应用 如何动态改变显示数据
来源:互联网 发布:淘宝联盟微信推广 编辑:程序博客网 时间:2024/06/05 20:24
1.场景/功能描述
1.1产品分类管理(增加,修改,删除,查询)
1.2产品查询界面,查询下拉条件有:产品分类。
2.分析
业务数据存储在数据库。界面显示时请求web服务器,再而从数据库中读取数据。
相同:场景中1.1查询所有产品分类与1.2加载所有产品分类作为条件,这两部分的数据集一样
不同:场景1.2的数据集需要多一项,“全部”,即用户可选“全部”项,查询所有分类的产品
3.实现
只描述关键代码
方法1:
前台:
Ext.Ajax.request({
extraParams:{'from':'1.1'}//from表示界面源,1.1表示场景1.1
});
后台:
IList<ProductCate> listCate = db.getList("select cateid,catename from tbProductCate ");//读取数据
string _from = Request.From["from"].ToString();
if( _from == "1.2")
{
listCate.insert(0, new ProductCate("-1","全部"));
}
Respone.Write(listCate.toJSON());
Respone.End();
方法2:
在场景1.2部分js代码中,在 productCateJsonStore增加load事件的监听。
var productCateJsonStore = new Ext.data.JSONStore(
...//其他配置简略
listeners : {
load : function()
{
this.insert(0,{cateid:-1,catename:'全部'});
//this.add({cateid:-1,catename:'全部'});是加载到最后面
}
}
);
方法3:
在场景1.2中将下拉框单选改为列表多选。
对比分析:
方法1:比较土,修改代码量少,扩展性中等。
方法2:实现当前需求最简单做法。
方法3:修改代码量大,但用户体验好。
4.扩展
1.1产品分类管理(增加,修改,删除,查询)
1.2产品查询界面,查询下拉条件有:产品分类。
2.分析
业务数据存储在数据库。界面显示时请求web服务器,再而从数据库中读取数据。
相同:场景中1.1查询所有产品分类与1.2加载所有产品分类作为条件,这两部分的数据集一样
不同:场景1.2的数据集需要多一项,“全部”,即用户可选“全部”项,查询所有分类的产品
3.实现
只描述关键代码
方法1:
前台:
Ext.Ajax.request({
extraParams:{'from':'1.1'}//from表示界面源,1.1表示场景1.1
});
后台:
IList<ProductCate> listCate = db.getList("select cateid,catename from tbProductCate ");//读取数据
string _from = Request.From["from"].ToString();
if( _from == "1.2")
{
listCate.insert(0, new ProductCate("-1","全部"));
}
Respone.Write(listCate.toJSON());
Respone.End();
方法2:
在场景1.2部分js代码中,在 productCateJsonStore增加load事件的监听。
var productCateJsonStore = new Ext.data.JSONStore(
...//其他配置简略
listeners : {
load : function()
{
this.insert(0,{cateid:-1,catename:'全部'});
//this.add({cateid:-1,catename:'全部'});是加载到最后面
}
}
);
方法3:
在场景1.2中将下拉框单选改为列表多选。
对比分析:
方法1:比较土,修改代码量少,扩展性中等。
方法2:实现当前需求最简单做法。
方法3:修改代码量大,但用户体验好。
4.扩展
在JSONStore的load事件里,可get某一条数据,然后修改某一项的值,或者remove
转自:http://blog.csdn.net/dafeng168/article/details/6650918
- extjs JSONStore的load事件/insert,add方法应用 如何动态改变显示数据
- extjs JSONStore的load事件/insert,add方法应用 如何动态改变显示数据
- Extjs 如何获取jsonstore中的数据
- ExtJs 动态改变combo显示数据
- 在Ext的JsonStore的load方法中使用回调callback 修改treeStore 数据
- extjs JsonStore加载数据,Combobox只显示最后一项值问题
- extjs ADD()方法的添加
- Extjs store的load事件监听
- extjs 2.3 修复 jsonstore 嵌套多级引用数据NULL的BUG
- 如何动态设置ExtJS Form控件文字显示的颜色
- extjs store load 额外参数的应用
- Insert数据的方法
- Extjs 动态改变fieldLabel的值
- Android 根据Edittext内容动态改变Listview显示的数据
- ExtJS动态改变grid的store的url地址,重新加载grid的数据
- ExtJS的FormPanel中的组件使用load加载远程的JSON数据的方法
- extjs JsonStore详解
- Material Design实现应用动态改变色调的方法
- Android Parcelable接口使用介绍
- 使用 ruby 下载 youtube 视频以及字幕
- 我现在眼中的程序员
- 指向函数指针举例
- wzplayer for android mms流播放
- extjs JSONStore的load事件/insert,add方法应用 如何动态改变显示数据
- 手动修复输入表时的发现---对于IID输入表和IAT和INT对应关系及程序载入DLL
- 一个n个整数序列取m个数,使其概率相同问题
- 火狐与IE兼容性问题的解决方法
- asp 杂记
- 着手LAMP,从零开始
- Asp.net中Web.config连接字符串及配置数据库sqlserver
- 什么是RAID、RAID卡、RAID0.1.5、热插拔SAS硬盘
- 欢迎您在新浪博客安家