扩展Ext的JsonReader

最新推荐文章于 2021-03-19 10:49:11 发布

原创最新推荐文章于 2021-03-19 10:49:11 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

17 篇文章

订阅专栏

本文介绍如何使用ExtJS框架中的JsonReader组件读取JSON数据，并通过Store组件进行数据管理和展示。具体包括自定义JsonReader类以适应特定的数据格式，以及在加载数据前后的事件监听处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var MyJsonReader = Ext.extend(Ext.data.JsonReader, {
	read: function(response){
        var json = response.responseText;
        var o = Ext.decode(json);
        if(!o)
        {
            throw {message: 'JsonReader.read: Json object not found'};
        }
        
        this.responseJsonObject = o;
        return this.readRecords(o);
    }
});

var myReader = new MyJsonReader(
	{totalProperty: "totalCount", root: "root"},
	[
	 	{name: "priceId"},
	 	{name: "areaCode"},
	 	{name: "deptCode"},
	 	{name: "deptName"},
	 	{name: "priceTypeCode"},
	 	{name: "priceBallotQty"},
	 	{name: "priceWeightQty"},
	 	{name: "createdEmpCode"},
	 	{name: "createdTm"},
	 	{name: "modifiedEmpCode"},
	 	{name: "modifiedTm"}
	]
);

var store = new Ext.data.Store({
		proxy: new Ext.data.HttpProxy({url:"queryPriceByPage.action"}),
		reader: myReader,
		listeners: {
			beforeLoad: function(){
				if(Ext.isEmpty(Ext.getCmp("areaCodeCombox").getValue(), false))
				{
					Ext.Msg.alert("提示", "请选择地区代码!");
					return false;
				}
				
				this.baseParams = queryFormPanel.getForm().getValues();
	  			this.baseParams['limit'] = gridPanel.getTopToolbar().pageSize;
			},
			load: function(){
				Ext.getCmp("deptCountLabel").setText("  网点总数：" 
						+ myReader.responseJsonObject.allDeptCount 
						+ "         已配置数："
						+ myReader.responseJsonObject.configDeptCount
						+ "         未配置数："
						+ "<font style='font-weight:bold;color:red'>" + myReader.responseJsonObject.notConfigDeptCount, false) + "</font>";
			}
		}
	});