Flexmonster Pivot Table Component Live Demo

Export reportExport to different file extensions
  • Flash/JS API
  • HTML5 API
  • Flex API
Exporting report
Choose target format to export
Exporting report

To view this page ensure that Adobe Flash Player version 10.2.0 or greater is installed.

View source code

Source code for the Flexmonster Pivot Flash/JS API demo:

<html>
	<head>
		<title>FlexMonster Pivot Table & Charts</title>
		<link href="css/panels.css" rel="stylesheet" rev="stylesheet" type="text/css">
	</head>
	<body>
		<table width="100%">
			<tr>
				<td style="width:250px;height:65px;border-right:1px dotted #555555;"><div class="header-title">Exporting report</div>
					<div class="header-prompt">Choose target format to export</div></td>
				<td>
					<div class="IconLinks"> 
						<a href="javascript:void(0)" onclick="onBtnClick('print')" id="print"><span>Print</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('html')" id="html"><span>To HTML</span></a> <a href="javascript:void(0)" onclick="onBtnClick('csv')" id="csv"><span>To CSV</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('excel')" id="excel"><span>To Excel</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('image')" id="image"><span>To Image</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('pdf')" id="pdf"><span>To PDF</span></a>
					</div>
				</td>
			</tr>
			<tr>
				<td colspan="2"><div class="flexmonster-panel">
						<div id="title" class="title">Exporting report</div>
						<div id="pivotContent"> 
						</div>
					</div>
			</tr>
		</table>
		<script type="text/javascript" src="flexmonster/flexmonster.js"></script> 
		<script type="text/javascript">
			flexmonster.embedPivotComponent("flexmonster/", "pivotContent", "100%", "600", {
				configUrl: "reports/report.xml"
			}, "flash");
			
			function onBtnClick(type)
			{
				if (type=="print") {
					flexmonster.print();	
				} else {
					flexmonster.exportTo(type);	
				}
			}
		</script>
	</body>
</html>
						
Exporting report
Choose target format to export
Exporting report
View source code

Source code for the Flexmonster Pivot HTML5 API demo:

<html>
	<head>
		<title>FlexMonster Pivot Table & Charts</title>
		<link href="css/panels.css" rel="stylesheet" rev="stylesheet" type="text/css">
	</head>
	<body>
		<table width="100%">
			<tr>
				<td style="width:250px;height:65px;border-right:1px dotted #555555;"><div class="header-title">Exporting report</div>
					<div class="header-prompt">Choose target format to export</div></td>
				<td>
					<div class="IconLinks"> 
						<a href="javascript:void(0)" onclick="onBtnClick('html')" id="html"><span>To HTML</span></a> <a href="javascript:void(0)" onclick="onBtnClick('csv')" id="csv"><span>To CSV</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('excel')" id="excel"><span>To Excel</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('image')" id="image"><span>To Image</span></a> 
						<a href="javascript:void(0)" onclick="onBtnClick('pdf')" id="pdf"><span>To PDF</span></a>
					</div>
				</td>
			</tr>
			<tr>
				<td colspan="2"><div class="flexmonster-panel">
						<div id="title" class="title">Exporting report</div>
						<div id="pivotContent"> 
						</div>
					</div>
			</tr>
		</table>
		<script type="text/javascript" src="flexmonster/flexmonster.js"></script> 
		<script type="text/javascript">
			flexmonster.embedPivotComponent("flexmonster/", "pivotContent", "100%", "600", {
				configUrl: "reports/report.xml"
			}, "html5");
			
			function onBtnClick(type)
			{
				flexmonster.exportTo(type);	
			}
		</script>
	</body>
</html>
						
Download Demo Source