我有两个单独的文件,一个 bargraph.html,另一个 data.php。
Bargraph.html如下:
<form method="POST" name="dataform" action="">
<select name="data1" id="data1-value">
<option value="DateRecorded">DateRecorded</option>
<option value="InletVoltage">InletVoltage</option>
<option value="InletCurrent">InletCurrent</option>
<option value="ActivePower">ActivePower</option>
<option value="PowerFactor">PowerFactor</option>
<option value="SystemID">SystemID</option>
</select>
<select name="data2" id ="data2-value">
<option value="DateRecorded">DateRecorded</option>
<option value="InletVoltage">InletVoltage</option>
<option value="InletCurrent">InletCurrent</option>
<option value="ActivePower">ActivePower</option>
<option value="PowerFactor">PowerFactor</option>
<option value="SystemID">SystemID</option>
</select>
</form>
<script type="text/javascript">
$('#data1-value').change(function(){
var data1Value = $(this).val();
$('#data2-value').change(function(){
var data2Value = $(this).val();
$.ajax({
type: 'post',
url: 'data.php',
dataType: 'html',
data: {data1, data2: data1Value, data2Value},
success:function(data){
alert(data);
},
error:function (xhr, ajaxOptions, thrownError){
alert(thrownError);
},
complete: function(){
}
});
})});
</script>
一段data.php如下:
if (isset($_POST['data1'])) {
$opp1 = $_POST['data1'];
$opp2 = $_POST['data2'];
} else {
$opp1 = 'SystemID';
$opp2 = 'ApparentPower';
}
$sql = "SELECT $opp1, $opp2 FROM RaritanMachineDataa";
在我的 bargraph.html 中,我有两个下拉菜单。我希望从下拉菜单中选择的选项使用 AJAX 发送到我的 data.php 文件以在我的数据库上执行选择语句。
目前当我运行我的代码时,它返回一个错误
Uncaught ReferenceError: data1 is not defined
这是指向第 53 行:
url: 'data.php',
有人可以给我一些帮助吗,因为我不知道如何解决这个问题。
更新:(下面的代码):
<script type="text/javascript">
$('#dataform').submit(function(e){
var data1Value = $("#data1").val();
var data2Value = $("#data2").val();
$.ajax({
type: 'post',
url: 'data.php',
dataType: 'html',
data: {data1, data1Value, data2: data2Value},
success:function(data){
alert(data);
},
error:function (xhr, ajaxOptions, thrownError){
alert(thrownError);
},
complete: function(){
}
});
})});
</script>
返回错误:
Uncaught SyntaxError: Unexpected token }
在线(倒数第二行)
})});
我试过删除括号和花括号,但似乎无法运行。我做错了什么?感谢您的协助
更新(提交按钮不发布数据):
<option value="PowerFactor">PowerFactor</option>
<option value="SystemID">SystemID</option>
</select>
<input type="submit" name="submit" value="Submit">
</form>
<script type="text/javascript">
$('#dataform').submit(function(e){
var data1Value = $("#data1").val();
var data2Value = $("#data2").val();
$.ajax({
type: 'post',
url: 'data.php',
dataType: 'html',
data: {data1, data1Value, data2: data2Value},
success:function(data){
alert(data);
},
error:function (xhr, ajaxOptions, thrownError){
alert(thrownError);
},
complete: function(){
}
});
e.preventDefault();
});
最佳答案
你的错误在这里:
$.ajax({
type: 'post',
url: 'data.php',
dataType: 'html',
data: {data1, data2: data1Value, data2Value}, <-- Your error is here
将此行更改为:
data: {data1: data1Value, data2: data2Value}
另外我刚刚注意到你正在这样做
('#data1-value').change(function(){
var data1Value = $(this).val();
$('#data2-value').change(function(){
var data2Value = $(this).val();
我不相信 $('#data2-value').change
会被调用。我建议您在设置两个值后处理表单的提交!!!
使用@Devpro 评论,您的下拉菜单现在需要分配一个 id 才能使此提交功能正常工作
HTML
<select name="data1" id="data1-value"> to <select id="data1" name="data1" id="data1-value">
<select name="data2" id ="data2-value"> to <select id="data2" name="data2" id ="data2-value">
JQuery
$('#dataform').submit(function(e) {
var data1Value = $("#data1").val();
var data2Value = $("#data2").val();
//ajax submit with my edits
$.ajax....
e.preventDefault(); //prevent page refresh.
});
关于php - 无法使用 AJAX 发送 POST 值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54863716/