Ticket/InsdepUI/expand/jquery-easyui-pivotgrid/pivotgrid.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Pivot Grid - jQuery EasyUI</title>
	<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
	<script type="text/javascript" src="../../jquery.min.js"></script>
	<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
	<script type="text/javascript" src="jquery.pivotgrid.js"></script>
</head>
<body>
	<h2>Pivot Grid</h2>
	<div style="margin-bottom:10px">
		<a href="javascript:void(0)" class="easyui-menubutton" style="width:70px;height:78px;" data-options="size:'large',iconCls:'icon-load',iconAlign:'top',plain:false,menu:'#mm'">Load</a>
		<a href="javascript:void(0)" class="easyui-linkbutton" style="width:70px;height:78px;" data-options="size:'large',iconCls:'icon-layout',iconAlign:'top',plain:false" onclick="javascript:$('#pg').pivotgrid('layout')">Layout</a>
	</div>
	<div id="mm" style="display:none">
		<div onclick="load1()">Load Data1</div>
		<div onclick="load2()">Load Data2</div>
	</div>
	<table id="pg" style="width:700px;height:300px"></table>
	<style type="text/css">
		.icon-load{
			background:url('load.png') no-repeat center center;
		}
		.icon-layout{
			background:url('layout.png') no-repeat center center;
		}
	</style>
	<script type="text/javascript">
		$(function(){
			load1();
		});

		function load1(){
			$('#pg').pivotgrid({
				url:'pivotgrid_data1.json',
				method:'get',
				pivot:{
					rows:['Country','Category'],
					columns:['Color'],
					values:[
						{field:'Price',op:'sum'},
						{field:'Discount',op:'sum'}
					]
				},
				forzenColumnTitle:'<span style="font-weight:bold">Pivot Grid</span>',
				valuePrecision:0,
				valueStyler:function(value,row,index){
					if (/Discount$/.test(this.field) && value>100 && value<500){
						return 'background:#D8FFD8'
					}
				}
			})
		}
		function load2(){
			$('#pg').pivotgrid({
				url:'pivotgrid_data2.json',
				method:'get',