所以我有这样的图表 http://jsfiddle.net/9uDmV/
我编写了函数来获取导出链接到xls
{
text: 'Download as xls',
onclick: function() {
location.href="getXLS.php?param1=param¶m2=para2";}
}
但我不想使用 GET 作为导出，因为它将我重定向到页面 getXLS。我想让它像其他功能一样（例如导出到 png，我单击它并出现下载窗口）
我想我应该为此使用 AJAX，但不知道如何使用它......
为了将数据保存到 xls，我将使用 http://phpexcel.codeplex.com/但首先我需要 POST 该数据而无需将页面重新加载到 getXLS。
指望你们，伙计们！
对不起，英语不好;-）
index_ajax.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'column',
zoomType: 'xy'
},
title: {
text: 'inbound datas'
},
subtitle: {
text: 'last ten days'
},
xAxis: [{
categories: ['2012-08-01', '2012-08-02', '2012-08-03', '2012-08-04', '2012-08-05', '2012-08-06', '2012-08-07', '2012-08-08', '2012-08-09', '2012-08-10', '2012-08-11', '2012-08-12']
}],
exporting: {
buttons: {
exportButton: {
menuItems: [{},
{},
{},
{}, /* leave standard buttons */
{
text: 'Download as xls',
onclick: function() {
$.get("ajax.php", { param1: "param1", param2: "param2" } );
}
}]
}
}
},
yAxis: [{
min: 0,
max: 100,
minorGridLineWidth: 0,
gridLineWidth: 0,
alternateGridColor: null,
plotBands: [{ // High wind
from: 90,
to: 100,
color: 'rgba(68, 170, 213, 0.1)',
label: {
text: 'AR to get',
style: {
color: '#606060'
}
}
}],
title: {
text: 'AR'
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},{
min: 0,
max: 8000,
gridLineWidth: 1,
title: {
text: 'Inbound',
style: {
color: '#AA4643'
}
},
labels: {
formatter: function() {
return this.value;
},
style: {
color: '#AA4643'
}
},
opposite: true
}],
tooltip: {
formatter: function() {
var unit = {
'AR': '% ',
'1': '1',
'2': '2',
'3': '3'
}[this.series.name];
return ''+
this.x +': '+ this.y +' '+ unit;
}
},
legend: {
align: 'right',
x: -100,
verticalAlign: 'top',
y: 20,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
}
}
},
series: [{
yAxis: 1,
name: '1',
data: [2000, 1000, 3000, 2000, 1000]
}, {
yAxis: 1,
name: '2',
data: [4000, 7000, 4000, 6000, 5000]
}, {
name: '3',
type: 'spline',
color: '#F7801F',
yAxis: 0,
data: [90, 80, 70, 90, 85],
}]
});
});
});
</script>
</head>
<body>
<script src="js/highcharts.js"></script>
<script src="js/modules/exporting.js"></script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
</body>
</html>
阿贾克斯.php
<?php
echo 'a prompt windows should apper';
?>
如果我
做对了，你想强制下载而不是重定向？如果是这样，请将这些标头添加到getXLS.php的顶部
<?php
// We'll be outputting an excel file
header('Content-Type: application/vnd.ms-excel;'); // This should work for IE & Opera
header("Content-type: application/x-msexcel"); // This should work for the rest
// It will be called dataAsExcel.xls
header('Content-Disposition: attachment; filename="dataAsExcel.xls"');
?>
这将指示浏览器您正在发送 excel 类型的文件，因此浏览器将通过save as对话框提示用户。
更多关于 php @ http://php.net/manual/en/function.header.php 中的标头
好的，如何做到这一点：
第一，使函数
function postajax(datas)
{
$.post('PHPExcel/export/ajax.php', datas, function(retData) {
$("body").append("<iframe src='PHPExcel/export/ajax.php' style='display: none;' ></iframe>");
});
}
现在创建按钮下载XLS文件
buttons: {
exportButton: {
menuItems: [{},
{},
{},
{}, /* leave standard buttons */
{
text: 'Download as xls',
onclick: function() {
postajax('My vaariable')
}
}]
}
}
仅此而已，现在从 http://phpexcel.codeplex.com/下载库大功告成！
非常感谢@Jugal塔卡尔的帮助和耐心！