gridpanel动态加载数据的实例代码


Posted in Javascript onJuly 18, 2013
<script type='text/javascript'>
function editEsOrder(options,success,response){
if (success){
var tagModelManager_maxOrderIdJson=Ext.util.JSON.decode(response.responseText);
var orderValue = tagModelManager_maxOrderIdJson.maxOrderId ;
Ext.getCmp('esorder').setValue(orderValue) ;
}
}
var tagModelManager_toolBar=new Ext.Toolbar({
items:[
{id:'tagModel_Save',text:'添加',iconCls:'add',handler:tagModel_Save}
,'-',
{id:'tagModel_dropSelected',text:'删除',iconCls:'remove',handler:tagModel_dropSelected}
]});
new Ext.grid.GridPanel({
id:'tagModelManager_tagModelGrid',
autoScroll:true,  store:new Ext.data.Store(),
cm:new Ext.grid.ColumnModel([new Ext.grid.RowNumberer()]),
sm:new Ext.grid.CheckboxSelectionModel(),
renderTo:'tagModelManager_tagModelDiv',
        width:Ext.getCmp('TagModel_win').getSize().width-16,
        height:Ext.getCmp('TagModel_win').getSize().height-35,
hideHeaders :false,
loadMask:{msg:'正在加载数据,请稍候....'},
collapsible : true,
collapsed : false,
bbar:new Ext.PagingToolbar({
id:'tagModelManager_tagModelPagingBar',
pageSize:getComboValue(),
store:new Ext.data.Store(),
displayInfo:true
}),
tbar:tagModelManager_toolBar
});
Ext.getCmp('tagModelManager_tagModelGrid').render() ;
Ext.getCmp('tagModelManager_tagModelGrid').on('rowdblclick', tagModelSelectRowDblClickEvent);
function tagModelSelectRowDblClickEvent(selectionModel, rowIndex, selectedRecord) {
  var selectedRows = Ext.getCmp('tagModelManager_tagModelGrid').getSelectionModel().getSelections();
      var row=selectedRows[0];   
      tagModel_SaveOrEdit('edit',row);
}
function tagModel_Save() {
      tagModel_SaveOrEdit('save');
}
function tagModelList_search() {
  Ext.Ajax.request({
  url:'editTagModel.html?method=getParams',
   callback:getSearchList
   });
}
function getSearchList(options,success,response) {
if (success){
var tagModelManager_json=Ext.util.JSON.decode(response.responseText);
tagModelManager_tagModelGridTitle = tagModelManager_json.tagModelManager_tagModelGridTitle;
var record = tagModelManager_json.record ;
var tagModelManager_tagModelColumnModels = tagModelManager_json.tagModelManager_tagModelColumnModels ;
        var tagModelManager_tagModelColumnModel=new Ext.grid.ColumnModel(Ext.util.JSON.decode("["+"new Ext.grid.RowNumberer()"+","+"new Ext.grid.CheckboxSelectionModel()"+","+tagModelManager_tagModelColumnModels+"]"));
tagModelManager_tagModelColumnModel.defaultSortable=true;
var strucutreModelManager_tagModelDataStore = new Ext.data.Store({
         baseParams: { tagModelKeyword : Ext.getCmp('tagModelManager_search_button').el.dom.value.trim() },
proxy:new Ext.data.HttpProxy({
url:'editTagModel.html?method=getTagModelDataList'
}),
reader:new Ext.data.JsonReader({
totalProperty:'resultSize',root:'tagModelList'},Ext.util.JSON.decode(record))  });
Ext.getCmp('tagModelManager_tagModelPagingBar').bind(strucutreModelManager_tagModelDataStore);
strucutreModelManager_tagModelDataStore.load({params:{start:0,limit:getComboValue()}}) ;
Ext.getCmp('tagModelManager_tagModelGrid').setTitle(tagModelManager_tagModelGridTitle) ;
Ext.getCmp('tagModelManager_tagModelGrid').reconfigure(strucutreModelManager_tagModelDataStore,tagModelManager_tagModelColumnModel);
Ext.getCmp('tagModelManager_tagModelGrid').expand(false) ;
}
}
function tagModelList_all(){
Ext.Ajax.request({
url:'editTagModel.html?method=getParams',
callback:getTagModel
});
}
function getTagModel(options,success,response){
if (success){
var tagModelManager_json=Ext.util.JSON.decode(response.responseText);
tagModelManager_tagModelGridTitle = tagModelManager_json.tagModelManager_tagModelGridTitle;
var record = tagModelManager_json.record ;
var tagModelManager_tagModelColumnModels = tagModelManager_json.tagModelManager_tagModelColumnModels ;
        var tagModelManager_tagModelColumnModel=new Ext.grid.ColumnModel(Ext.util.JSON.decode("["+"new Ext.grid.RowNumberer()"+","+"new Ext.grid.CheckboxSelectionModel()"+","+tagModelManager_tagModelColumnModels+"]"));
tagModelManager_tagModelColumnModel.defaultSortable=true;
var strucutreModelManager_tagModelDataStore = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({
url:'editTagModel.html?method=getTagModelDataList'
}),
reader:new Ext.data.JsonReader({
totalProperty:'resultSize',root:'tagModelList'},Ext.util.JSON.decode(record))  });
Ext.getCmp('tagModelManager_tagModelPagingBar').bind(strucutreModelManager_tagModelDataStore);
strucutreModelManager_tagModelDataStore.load({params:{start:0,limit:getComboValue()}}) ;
Ext.getCmp('tagModelManager_tagModelGrid').reconfigure(strucutreModelManager_tagModelDataStore,tagModelManager_tagModelColumnModel);
Ext.getCmp('tagModelManager_tagModelGrid').expand(false) ;
}
}
Ext.Ajax.request({
url:'editTagModel.html?method=getParams',
callback:getTagModel
});
</script>
    public void getTagModelDataList(ActionMapping mapping, ActionForm actionform,HttpServletRequest request, HttpServletResponse response){
    ITagModelManager tagmgr = this.getPkgServer().getDriver().getOperateServer().getTagModelManager() ;
    List<HashMap<String,String>> models = new ArrayList<HashMap<String,String>>();
    String tagModelKeyword = request.getParameter("tagModelKeyword");
    List<EssTagModel> tagModels ;
    tagModels =  tagmgr.getEssTagModels() ;
    int resultSize = 0 ;
    if (null != tagModels && !tagModels.isEmpty()){
    //数据分页显示
    resultSize = tagModels.size() ;
    String start = request.getParameter("start") ;
String perPage = request.getParameter("limit") ;
String esType ="";
if (null != start && null != perPage){
int fromIdx = Integer.parseInt(start);
int per =  Integer.parseInt(perPage);
int toIdx = fromIdx + per ;
if (toIdx  > resultSize) toIdx = resultSize ;
tagModels = tagModels.subList(fromIdx,toIdx) ;
}
    for(EssTagModel etm : tagModels){
    HashMap<String,String> map = new HashMap<String, String>();
    map.put("id",   Long.toString(etm.getId())) ;
    map.put("esidentifier", etm.getEsidentifier()) ;
    map.put("estype", etm.getEstype()) ;
    map.put("esdescription", etm.getEsdescription()) ;
    map.put("esorder", Long.toString(etm.getEsorder())) ;
    map.put("metadata", etm.getMetadata()) ;
    models.add(map) ;
    }
    }
    JSONObject json = new JSONObject();
    JSONArray ary = new JSONArray(models);
    json.put("tagModelList", ary);
json.put("resultSize",resultSize);
    writeJson(response, json.toString()) ;
    }
public void getParams(ActionMapping mapping, ActionForm actionform,HttpServletRequest request, HttpServletResponse response){
LinkedHashMap<String,String> tags = new LinkedHashMap<String,String>() ;
tags.put("id", "id") ;
tags.put("esidentifier", "字段") ;
tags.put("estype", "类型") ;
tags.put("esdescription", "描述") ;
tags.put("esorder", "顺序") ;
tags.put("metadata", "元数据") ;
tags.put("esisnull", "是否为必填项") ;
tags.put("eslength", "字段长度") ;
tags.put("esdotlength", "小数点位数") ;
tags.put("esissystem", "是否为系统字段") ;
JSONObject json = new JSONObject();
json.put("record", getJsonRecord(tags)) ;
json.put("tagModelManager_tagModelColumnModels", getJsonColumnModel(tags)) ;
writeJson(response,json.toString());
}
Javascript 相关文章推荐
javascript与有限状态机详解
May 08 Javascript
js实现鼠标感应向下滑动隐藏菜单的方法
Feb 20 Javascript
js判断日期时间有效性的方法
Oct 24 Javascript
比较常见的javascript中定义函数的区别
Nov 09 Javascript
jQuery异步提交表单的两种方式
Sep 13 Javascript
jQuery实现手机版页面翻页效果的简单实例
Oct 05 Javascript
完美解决jQuery的hover事件在IE中不停闪动的问题
Feb 10 Javascript
Vue.js获取被选择的option的value和text值方法
Aug 24 Javascript
Vue图片浏览组件v-viewer用法分析【支持旋转、缩放、翻转等操作】
Nov 04 Javascript
Vue中通过属性绑定为元素绑定style行内样式的实例代码
Apr 30 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
Sep 02 Javascript
在vue项目中promise解决回调地狱和并发请求的问题
Nov 09 Javascript
javaScript NameSpace 简单说明介绍
Jul 18 #Javascript
JS获取鼠标坐标的实例方法
Jul 18 #Javascript
非常好用的JsonToString 方法 简单实例
Jul 18 #Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
Jul 17 #Javascript
JS随机生成不重复数据的实例方法
Jul 17 #Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 #Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
Jul 17 #Javascript
You might like
为查询结果建立向后/向前按钮
2006/10/09 PHP
phpmyadmin安装时提示:Warning: require_once(./libraries/common.inc.php)错误解决办法
2011/08/18 PHP
PHP设计模式之单例模式定义与用法分析
2019/03/26 PHP
PHP的imageTtfText()函数深入详解
2021/03/03 PHP
javascript 随机展示头像实现代码
2011/12/06 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
2014/10/20 Javascript
Javascript设计模式之观察者模式的多个实现版本实例
2015/03/03 Javascript
js实现图片点击左右轮播
2015/07/08 Javascript
BootStrap的弹出框(Popover)支持鼠标移到弹出层上弹窗层不隐藏的原因及解决办法
2016/04/03 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
2017/01/08 Javascript
vue-resource 拦截器使用详解
2017/02/21 Javascript
Node.js常用工具之util模块
2017/03/09 Javascript
利用Mongoose让JSON数据直接插入或更新到MongoDB
2017/05/03 Javascript
移动前端图片压缩上传的实例
2017/12/06 Javascript
深入浅析angular和vue还有jquery的区别
2018/08/13 jQuery
three.js实现炫酷的全景3D重力感应
2018/12/30 Javascript
详解a标签添加onclick事件的几种方式
2019/03/29 Javascript
深入解析koa之中间件流程控制
2019/06/17 Javascript
[02:14]DOTA2英雄基础教程 修补匠
2013/12/23 DOTA
python使用ctypes模块调用windowsapi获取系统版本示例
2014/04/17 Python
详解Django中的权限和组以及消息
2015/07/23 Python
以视频爬取实例讲解Python爬虫神器Beautiful Soup用法
2016/01/20 Python
python的Crypto模块实现AES加密实例代码
2018/01/22 Python
基于python3实现socket文件传输和校验
2018/07/28 Python
用Python写一个自动木马程序
2019/09/17 Python
CSS3中Transition动画属性用法详解
2016/07/04 HTML / CSS
HTML5自定义视频播放器源码
2020/01/06 HTML / CSS
canvas 绘图时位置偏离的问题解决
2020/09/16 HTML / CSS
资深生产主管自我评价
2013/09/22 职场文书
教师实习自我鉴定
2013/12/13 职场文书
县级文明单位申报材料
2014/05/23 职场文书
法人单位适用的授权委托书
2014/09/19 职场文书
中学生自我评价范文
2015/03/03 职场文书
销售经理助理岗位职责
2015/04/13 职场文书
订货会主持词
2015/07/01 职场文书
国际最新研究在陨石中发现DNA主要成分 或由陨石带来地球
2022/04/29 数码科技