jQuery$.post不'；在PHP文件中使用时，似乎无法识别url参数_Php_Jquery_Ajax_.post

jQuery$.post不'；在PHP文件中使用时，似乎无法识别url参数

php jquery ajax

jQuery$.post不'；在PHP文件中使用时，似乎无法识别url参数,php,jquery,ajax,.post,Php,Jquery,Ajax,.post,我有一个包含表单的PHP文件。我想使用jQuery中的$.post方法发布表单结果，并使用结果填充页面上的DIV，而无需页面刷新。当我按下submit时，我在Chrome开发工具的网络部分看到的是，指定的参数被传递到当前页面（reports.php），而不是我在URL中指定的页面表单在reports.php上，我想发布到getSurveys.php。下面是reports.php的代码： <?php include("php/common.php"); ?> <html>

我有一个包含表单的PHP文件。我想使用jQuery中的

$.post

方法发布表单结果，并使用结果填充页面上的DIV，而无需页面刷新。当我按下submit时，我在Chrome开发工具的网络部分看到的是，指定的参数被传递到当前页面（reports.php），而不是我在URL中指定的页面

表单在reports.php上，我想发布到getSurveys.php。下面是reports.php的代码：

<?php
include("php/common.php");
?>
<html>
<head>
<title>Reports</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<script src="http://jquery.bassistance.de/validate/additional-methods.js"></script>
<script>
$("document").ready(function () {
$("#reportform").submit(function() {

var tech = $("#tech_id").val();
var loc = $("#location").val();
var startdate = $("#startdate").val();
var enddate = $("#enddate").val();
var url = "getSurveys.php";
$("#results").html('<br><img src="ajax-loader.gif" /><br>');
$.post(
        url,
        {
         tech: tech,
         loc: loc,
         startdate: startdate,
         enddate: enddate
        },
        function (data) {
            var result = data;
            console.log(result);
        },
        "json"
        );
});
});
</script>
</head>
<body>
<center>
<div  id="criteria" name="criterai" width="75%">
<center>
<h2>Criteria</h2>
<form id="reportform">
<table id="criteriatable" name="criteriatable" width="75%" border="0" cellpadding="3">
<tr>
<td>
<label for="tech_id">Choose a Technician</label>
<br>
<select name="tech_id" id ="tech_id">
<?php 
$q = $conn->query("SELECT *
FROM technicians");
$q->setFetchMode(PDO::FETCH_ASSOC);
while($t = $q->fetch()) {
$techs = $t['tech_id'];
echo "<option>
$techs
</option>";
}
?>
</select>
</td>
<td>
<label for="location">Choose a Location</label>
<br>
<select name="location" id ="location">
<?php 
$q = $conn->query("SELECT *
FROM locations");
$q->setFetchMode(PDO::FETCH_ASSOC);
while($l = $q->fetch()) {
$locs = $l['name'];
echo "<option>
$locs
</option>";
}
?>
</select>
</td>
<td>
<h4>Choose Date Range</h4>
<br>
<label for="startdate">Start Date</label>
<br>
 <input  id="startdate" type=date  name="startdate" >
<br>
 <label for="enddate">End Date</label>
<br>
<input  id="enddate" type=date  name="enddate" >
</td>
</tr>
</table>
<center>
<input type="submit" id="refresh" name="refresh" value ="Refresh">
</center>
</form>
<script>
$( "#reportform" ).validate({
  rules: {
    startdate: {
      required: true,
      date: true
    },
    enddate: {
        required: true,
        date: true
    }
  }
});
</script>
<br>
</center>
</div>
<br>
<br>
<div id="results" name = "results" width="75%"></div>
</center>
</body>
</html>


报告
$（“文档”）.ready（函数（）{
$（“#报表”）。提交（函数（）{
var tech=$（“#tech_id”）.val（）；
var loc=$（“#位置”）.val（）；
var startdate=$（“#startdate”）.val（）；
var enddate=$（“#enddate”）.val（）；
var url=“getSurveys.php”；
$（“#结果”）.html（“

”）；
美元邮政(
网址，
{
科技：科技，
loc:loc，
开始日期：开始日期，
结束日期：结束日期
},
功能（数据）{
var结果=数据；
控制台日志（结果）；
},
“json”
);
});
});
标准
选择技术人员


选择一个位置


选择日期范围


开始日期




结束日期


$（“#报表”）.validate({
规则：{
起始日期：{
要求：正确，
日期：对
},
截止日期：{
要求：正确，
日期：对
}
}
});

同样，问题是当我看到它发布到哪里时，它发布到reports.php？tech=vale&loc=value等，而不是getSurvey.php！我错过了什么

您需要

返回false以防止浏览器执行提交表单的默认操作。
您需要返回false以防止浏览器执行提交表单的默认操作。
取消导致表单提交的表单的默认事件
<script>
$("document").ready(function () {
    $("#reportform").submit(function(e) {

        e.preventDefault(); //prevents form submission
        //rest of function
    });
});
</script>


$（“文档”）.ready（函数（）{
$（“#报表”）。提交（功能（e）{
e、 preventDefault（）；//防止表单提交
//剩余功能
});
});
取消导致表单提交的表单的默认事件
<script>
$("document").ready(function () {
    $("#reportform").submit(function(e) {

        e.preventDefault(); //prevents form submission
        //rest of function
    });
});
</script>


$（“文档”）.ready（函数（）{
$（“#报表”）。提交（功能（e）{
e、 preventDefault（）；//防止表单提交
//剩余功能
});
});
抱歉，我看到我问题中的代码顶部不在那里，这里是：Reports抱歉，我看到我问题中的代码顶部不在那里，这里是：Reports@TommyAlexander很高兴我能帮上忙。@TommyAlexander很高兴我能帮上忙。