[英]jQuery AJAX form not posting results
I have been having problems returning results from my database using AJAX. 我一直在使用AJAX从我的数据库返回结果时遇到问题。 I have tried to echo $diskspace
and $price
, both of which are returning undefined. 我试图回应$diskspace
和$price
,两者都返回undefined。
index.php 的index.php
<form id="form" method="POST">
Diskspace:
<select id="Diskspace">
<option value="0 AND 1">$0 - 1GB</option>
<option value="1 AND 5">$1 - 5GB</option>
<option value="5 AND 10">$5 - 10GB</option>
</select></br></br>
Price:
<select id="Price">
<option value="0 AND 5">$0 - $5</option>
<option value="1 AND 5">$5 - $10</option>
<option value="10 AND 20">$10 - $20</option>
<option value="20 AND 40">$20 - $40</option>
<option value="40 and 500">>$40</option>
</select></br></br>
<input type="submit" id="submit" value="enter">
</form>
<div id="output"></div>
JS JS
$(document).ready(function(){
$("div#output").hide();
$("#submit").click(function(){
$.post('join.php', {
diskspace: $("#diskspace").val(),
price: $("#price").val()
},
function(data){
$("div#output").html(data);
$("div#output").show();
}
);
return false;
});
});
</script>
join.php join.php
<?php
if (isset($_POST['diskspace'])){
mysql_connect("localhost","root","") or die('Could not connect');
mysql_select_db("webhost") or die ('Could not find DB');
$diskspace = $_POST['diskspace'];
$price =$_POST['price'];
$query = mysql_query("
SELECT * FROM data WHERE Diskspace BETWEEN $diskspace
AND Price BETWEEN $price
");
$count = mysql_num_rows($query);
if ($count == 0){
$output = "No such results, sorry.";
}else{
while($row = mysql_fetch_array($query)){
$diskspace = $row['Diskspace'];
$price = $row['Price'];
$host = $row['Provider'];
$output .= '<div>'.$host.' '.$diskspace.' '.$price.'</div>';
}
}
echo $output;
}
?>
Your HTML element has an id of Diskspace
and you're looking for an element of diskspace
. 您的HTML元素的ID为Diskspace
,您正在寻找diskspace
的元素。
Take the following for example: 以下面的例子为例:
<select id="Diskspace">
<option value="hello">hello</option>
</select>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
console.log( $('#diskspace').val() );
});
</script>
The result is undefined, and in new versions of jQuery, if the element cannot be found it will not pass the variable through ajax/post. 结果是未定义的,并且在新版本的jQuery中,如果找不到该元素,它将不会通过ajax / post传递变量。
The same applies to your Price
element. 这同样适用于您的Price
元素。
Your select id is not same in your jquery. 您的选择ID在您的jquery中不相同。 Change it like this: 像这样改变它:
<form id="form" method="POST">
Diskspace:
<select id="diskspace">
<option value="0 AND 1">$0 - 1GB</option>
<option value="1 AND 5">$1 - 5GB</option>
<option value="5 AND 10">$5 - 10GB</option>
</select></br></br>
Price:
<select id="price">
<option value="0 AND 5">$0 - $5</option>
<option value="1 AND 5">$5 - $10</option>
<option value="10 AND 20">$10 - $20</option>
<option value="20 AND 40">$20 - $40</option>
<option value="40 and 500">>$40</option>
</select></br></br>
<input type="submit" id="submit" value="enter">
</form>
<div id="output"></div>
replace: 更换:
diskspace: $("#diskspace").val(),
with 同
diskspace: $("#Diskspace").val(),
You didn't give your <select>
s names: 你没有给出<select>
的名字:
<select id="Diskspace" name="Diskspace">
^^^^^^^^^^^^^^^^--- missing
No name, no form submission for that field. 没有名称,没有提交该字段的表单。 id
does NOT count - it's used purely for DOM operations, and is not relevant for form submissions. id
不计算 - 它纯粹用于DOM操作,与表单提交无关。
Beyond that, you're vulnerable to SQL injection attacks . 除此之外,您还容易受到SQL注入攻击 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.