我想用jquery来调用php在同一页面上显示数据。但是,如果我使用jquery来调用数据,我会继续得到" 0结果"但是当我使用提交按钮时,我在.php窗口中获得了正确的数据...感谢任何帮助!谢谢!
哦,我在不同的文件中有三个脚本但是在html文件中将jquery链接在头部。提前谢谢!
HTML
<form method="post" action="contract.php">
<fieldset>
<div class="wrap_21">
<fieldset id="accountnumber">
<input type="text" name="accountnumber" placeholder="Account Number" value="" required style="width:240px; height:24px"/>
</fieldset>
</div>
<div class="wrap_16">
<fieldset id="tradetype">
<span class="text_9">TRADE:</span>
<span class="text_11">
<input type="radio" name="tradetype" required value="Buy"/> Buy
<input type="radio" name="tradetype" value="Sell"/> Sell </span>
</fieldset>
<fieldset>
<span class="text_9">PRICE:</span>
<span class="text_11">
<input type="text" name="price" value="" required /></span>
</fieldset>
<fieldset>
<span class="text_9">DATE:</span>
<select name="date" id="date" onchange="showData(this.Value)">
<option value="">Select</option>
<option value="24 November 2015">24-Nov-15</option>
<option value="24 December 2015">24-Dec-15</option>
<option value="24 January 2015">24-Jan-15</option>
</select>
</fieldset>
<input type="submit" name="formSubmit" value="Submit">
</fieldset>
PHP
<?php
$servername = "localhost";
$username = "";
$password = "";
$dbname = "";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: ". $conn->connect_error);
}
$tradetype=$_POST['tradetype'];
$price=$_POST['price'];
$date=$_POST['date'];
$sql = "SELECT * FROM Contracts WHERE Trade='$tradetype' AND ExpiryDate='$date'";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
//output data of each row
while($row = $result->fetch_assoc()) {
echo "Premium: " . $row["Premium"]. " Discount: " . $row["Discount"] . "<br>";
}
} else {
echo "0 results";
}
$conn->close();
?>
Jquery的
function showData(str) {
if (str=="") {
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","contract.php?q="+str,true);
xmlhttp.send();
}
答案 0 :(得分:1)
这是你的问题:showData(this.Value)
,在你的php中你有3个帖子变量只发送一个
尝试这样的事情:
从选择
中删除onchange="showData(this.Value)
$('select[name="date"]').on('change',function(e){
e.preventDefault();
var parent = $(this).parents('form');
$.ajax({url: "contract.php",
type:"POST",
data:{
'tradetype':parent.find('input[name="tradetype"]').val(),
'price':parent.find('input[name="price"]').val(),
'date':parent.find('option:selected').val()
},
success: function(result) {
$("#result").html(result);
}});
答案 1 :(得分:1)
完整的HTML代码: -
<form method="get" id="formpge" action="">
<fieldset>
<div class="wrap_21">
<fieldset id="accountnumber">
<input type="text" name="accountnumber" id="accountnumber" placeholder="Account Number" value="" required style="width:240px; height:24px"/>
</fieldset>
</div>
<div class="wrap_16">
<fieldset id="tradetype">
<span class="text_9">TRADE:</span>
<span class="text_11">
<input type="radio" name="tradetype" id="tradetype" required value="Buy"/> Buy
<input type="radio" name="tradetype" id="tradetype" value="Sell"/> Sell </span>
</fieldset>
<fieldset>
<span class="text_9">PRICE:</span>
<span class="text_11">
<input type="text" name="price" id="price" value="" required /></span>
</fieldset>
<fieldset>
<span class="text_9">DATE:</span>
<select name="date" id="date" >
<option value="">Select</option>
<option value="24 November 2015">24-Nov-15</option>
<option value="24 December 2015">24-Dec-15</option>
<option value="24 January 2015">24-Jan-15</option>
</select>
</fieldset>
<input type="button" name="formSubmit" id="formSubmit" value="Submit">
<div id="result"></div>
</fieldset>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$(document).ready(function(){ //newly added
$( "#date" ).change(function() {
event.preventDefault();
var data = $( "#formpge" ).serialize();
var url = 'contract.php?'+data;
$.get( , function( data ) {
$( "#result" ).html( data );
});
});
});
</script>
你的php中的将$ _POST更改为$ _GET;
答案 2 :(得分:0)
你没有通过
贸易类型,价格,日期;请求中的参数
所以试试
function showData(str) {
var data={
tradetype :$('#tradetype').val(),
price:$('#price').val(),
date:$('#date').val()
};
if (str=="") {
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","contract.php",true);
xmlhttp.send(data);
}
答案 3 :(得分:-1)
您可以在这里获得详细的教程 -
http://www.a100websolutions.in/retrieve-data-using-jquery-php/
完整教程,演示如何在后端使用AJAX / JQuery和PHP从数据库获取数据。此外,代码在那里,所以你也可以参考代码。