Ext4访问Servlet并将结果显示到Grid上

最新推荐文章于 2017-11-28 20:31:59 发布

book1cm

最新推荐文章于 2017-11-28 20:31:59 发布

阅读量561

点赞数

分类专栏： Ext4 Servlet 后台文章标签： servlet ext header function autoload url

本文链接：https://blog.csdn.net/book1cm/article/details/6830440

版权

Servlet 同时被 3 个专栏收录

1 篇文章 0 订阅

订阅专栏

后台

1 篇文章 0 订阅

订阅专栏

Ext4

0 篇文章 0 订阅

订阅专栏

最近着手开发一个报表平台，主要技术框架是Servlet+Ext4。Ext4变化很大，很多示例代码在网上都还很难搜索到，整个探索过程比较曲折，也因此总结出一些技术点，我将陆续发布，希望让后学者少走弯路。

本次贴上Ext4访问Servlet并将结果显示到Grid上：

Ext.define("ReportModel", {
     extend: "Ext.data.Model",
     fields: ["客户","物料","销售数量","销售金额"]
 });

 var ajaxProxy = Ext.create("Ext.data.proxy.Ajax", {
     type:"ajax",
     url: "/easportal/RptDataSourceServlet?metas=/metas/KDPlayStation.xml ", //指定Servlet的URL和参数
     extraParams: {  },
     reader: {
         type: "json",
         root: "result"
     }
 });

 var datastore  =  Ext.create('Ext.data.Store', {
     autoLoad: false,
     model: ReportModel,
     proxy: ajaxProxy
 });
 
var panel = Ext.create('Ext.grid.Panel', {
     store: datastore,
     columns: [
         {
            header:'NO.',
            width:30, 
            renderer:function(value, cellmeta, record, rowIndex){
                 return "<span style='font-weight:bold'>" + (rowIndex + 1) + "</span>";
             }
         },
         
         { header: "客户",
						dataIndex: "客户",
						renderer: function(value, metadata, record, rowIndex, colIndex, store){ return applyFontSize(value)}
					},
					{ header: "物料",
						dataIndex: "物料",
						renderer: function(value, metadata, record, rowIndex, colIndex, store){ return applyFontSize(value)}
					},
					{ header: "销售数量",
						dataIndex: "销售数量",
						align: "right",
						renderer: function(value, metadata, record, rowIndex, colIndex, store){ return applyFontSize(Ext.util.Format.number(value, '0,000')) } } 
					}
				
				                                                        
			], // end of columns
			height: containerHeight,
			width:  containerWidth,
			renderTo: Ext.get("divGrid")
});