我使用Google Charts来显示一个折线图，该折线图从一个PHP服务获取数据，该服务根据输入的日期运行查询。查询工作，它正在获取数据，然而，当试图将我的日期传递到url中，并将数据返回图表时，我似乎无法在不离开该页面的情况下"刷新"图表，因为当我提交表单或"日期字段"时，它只会转到服务url....这就是我所经历的。
这是我在实际显示图表的索引页上包含的内容:
function drawChart() {
var jsonData1 = $.ajax({
url: "http://helpdesk/reporting/interface/charts/services/ticketsopenedclosed.php?startDate=<?php print $startDate = $_GET['startDate'] ?>&endDate=<?php print $endDate = $GET_['endDate'] ?>",
dataType:"json",
async: false
}).responseText;
这里是我实际上有我的表单(同一页，有图表，我想从表单的数据刷新!!)
<div><form action="charts/ticketsopenedclosedchart.php" method="get"><div class="well">
<input type="text" class="span2" value="startDate" data-date-format="yyyy-mm-dd" id="dp2" name="startDate">
<input type="text" class="span2" value="endDate" data-date-format="yyyy-mm-dd" id="dp3" name="endDate">
<button type="submit" class="btn btn-default">Refresh Data</button></div></form>
<div class="container">
<div class="row">
</div>
</div>
</div>
<?php require("charts/ticketsopenedclosedchart.php")?>
<div id="ticketsCreated"></div>
显然，当我点击提交按钮时它会点击url并给出日期和来自服务的数据。但我想用这些数据刷新我的图表而不是让用户去看
这是因为当您提交表单时，浏览器会自动转到action属性中指定的URL。为了解决这个问题，您需要在按钮上使用onClick处理程序。
所以像这样:
<button type="submit" class="btn btn-default" onClick="handleRefresh">Refresh Data</button>
然后JS:
function handleRefresh(e){
e.preventDefault();
drawChart();
}