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 相关文章推荐
IE关闭时判断及AJAX注销案例学习
Feb 18 Javascript
使用javascript过滤html的字符串(注释标记法)
Jul 08 Javascript
javascript 获取元素样式必杀技
May 04 Javascript
jQuery搜索同辈元素方法
Feb 10 Javascript
JavaScript实现的背景自动变色代码
Oct 17 Javascript
jquery easyUI中ajax异步校验用户名
Aug 19 Javascript
js简单获取表单中单选按钮值的方法
Aug 23 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的三大方法
Jan 22 Javascript
vue 2.0路由之路由嵌套示例详解
May 08 Javascript
vue实现学生录入系统之添加删除功能
Jul 11 Javascript
如何利用 JS 脚本实现网页全自动秒杀抢购功能
Oct 12 Javascript
javascript实现用户必须勾选协议实例讲解
Mar 24 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
Sample script that displays all of the users in a given SQL Server DB
2007/06/16 Javascript
ASP SQL防注入的方法
2008/12/25 Javascript
javascript使用eval或者new Function进行语法检查
2010/10/16 Javascript
jQuery+css+html实现页面遮罩弹出框
2013/03/21 Javascript
jquery 无限级联菜单案例分享
2013/03/26 Javascript
javascript:文字不间断向左移动的实例代码
2013/08/08 Javascript
JS简单实现登陆验证附效果图
2013/11/19 Javascript
开发中可能会用到的jQuery小技巧
2014/03/07 Javascript
javascript下拉列表菜单的实现方法
2015/11/18 Javascript
理解javascript闭包
2015/12/15 Javascript
AngularJS控制器之间的数据共享及通信详解
2016/08/01 Javascript
vue制作加载更多功能的正确打开方式
2016/10/12 Javascript
vuejs手把手教你写一个完整的购物车实例代码
2017/07/06 Javascript
关于vue-resource报错450的解决方案
2017/07/24 Javascript
JavaScript实现的原生态Tab标签页功能【兼容IE6】
2017/09/18 Javascript
JS中的回调函数实例浅析
2018/03/21 Javascript
vue + element-ui的分页问题实现
2018/12/17 Javascript
bootstrap table列和表头对不齐的解决方法
2019/07/19 Javascript
有关wxpython pyqt内存占用问题分析
2014/06/09 Python
详谈Numpy中数组重塑、合并与拆分方法
2018/04/17 Python
python文本数据处理学习笔记详解
2019/06/17 Python
Python的形参和实参使用方式
2019/12/24 Python
Tensorflow之梯度裁剪的实现示例
2020/03/08 Python
简单的Python人脸识别系统
2020/07/14 Python
Python2及Python3如何实现兼容切换
2020/09/01 Python
Pytho爬虫中Requests设置请求头Headers的方法
2020/09/22 Python
HTML5中使用json对象的实例代码
2018/09/10 HTML / CSS
shell程序中如何注释
2012/02/17 面试题
个人自我评价范文
2014/02/05 职场文书
期中考试后的反思
2014/02/08 职场文书
计算机应届毕业生自荐信范文
2014/02/23 职场文书
2015毕业生简历自我评价
2015/03/02 职场文书
酒店圣诞节活动总结
2015/05/06 职场文书
商业计划书格式、范文
2019/03/21 职场文书
Linux、ubuntu系统下查看显卡型号、显卡信息详解
2022/04/07 Servers
Java实现贪吃蛇游戏的示例代码
2022/09/23 Java/Android