Highcharts再次出口
所以我有这样的图表http://jsfiddle.net/9uDmV/
我写函数来获得出口链接到XLS
{ text: 'Download as xls', onclick: function() { location.href="getXLS.php?param1=param¶m2=para2";} } 但是我不想使用GET作为导出，因为它将页面redirect到getXLS。 我想使它像其他function（例如导出到PNG，我点击它，下载窗口出现）
我想我应该使用AJAX的这个，但不知道如何exacly使用它….
为了将数据保存到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>
ajax.php
<?php echo 'a prompt windows should apper'; ?>
如果我知道它是正确的，你想强制下载，而不是redirect？ 如果是这样，请将这些标题添加到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"'); ?>
这将表明您正在发送一个types为excel的文件的浏览器，并且浏览器将因此提示用户save as对话框。
更多关于PHP的头文件http://php.net/manual/en/function.header.php
好的，该怎么做：
最好，做function
function postajax(datas) { $.post('PHPExcel/export/ajax.php', datas, function(retData) { $("body").append("<iframe src='PHPExcel/export/ajax.php' style='display: none;' ></iframe>"); }); }
现在创buildbutton来下载xls文件
buttons: { exportButton: { menuItems: [{}, {}, {}, {}, /* leave standard buttons */ { text: 'Download as xls', onclick: function() { postajax('My vaariable') } }] } }
就这些，现在从http://phpexcel.codeplex.com/下载库，你就完成了！
非常感谢@Jugal Thakkar的帮助和耐心！