我有三个html表单值fname,lname,age。我想把它发送到服务器端php文件,并插入到数据库。
我的html表单是这样的:<html>
<head>
<script>
function insert(fname,lname,age)
{
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","ajax_db_php.php?fname=fname&lname=lname&age=age",true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<table>
<tr><td>First Name : </td><td> <input type="text" fname="fname"/> </td> </tr>
<tr><td>Last Name : </td><td> <input type="text" fname="lname"/> </td> </tr>
<tr><td>City : </td><td> <input type="text" fname="age"/> </td> </tr>
<input type="submit" onclick="insert(fname,lname,age)">
</table>
</form>
</body>
</html>
因为我已经使用ajax,它不应该加载整个页面,但当我点击提交按钮,它加载整个页面。为什么?接收值并插入数据库的php页面是:
<html>
<body>
<?php
$fname=$_GET['fname'];
$lname=$_GET['lname'];
$age=$_GET['age'];
//echo "firstname : " $fname;
$con=mysqli_connect('127.0.0.1:3306' ,'root','root','my_db');
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$sql="INSERT INTO table1 (fname, lname, age)
VALUES
('$_POST[fname]','$_POST[lname]','$_POST[age]')";
$result=mysql_query($sql);
if (!mysqli_query($con,$sql))
{
die('Error: ' . mysqli_error($con));
}
echo "1 record added";
mysqli_close($con);
?>
</body>
</html>
当我点击提交按钮时,它什么也没有显示,没有错误,也没有更新数据库
您正确设置了$fname
, $lname
和$age
,但您从未使用它们,而是使用不存在的$_POST
变量。
代替('$_POST[fname]','$_POST[lname]','$_POST[age]')";
应该使用$_GET
变量,例如
('$fname','$lname','$age')";
我还建议您在将字符串添加到数据库时转义字符串。一个可能的解决方案是使用Prepared语句。
尼古拉所说的改变然后修改HTML
input type="submit"
input type="button"
这将不会重新加载页面。然后从PHP中删除以下标签
<html>
<body>
</html>
</body>
我建议使用jQuery进行ajax调用
更新如何使用ajax和序列化:
这是test.php
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js" ></script>
<script>
$(document).ready(function(){
$("form").on('submit',function(event){
event.preventDefault();
alert("Hello");
data = $(this).serialize();
$.ajax({
type: "GET",
url: "test2.php",
data: data
}).done(function( msg ) {
alert( "Data Saved: " + msg );
});
});
});
</script>
</head>
<body>
<form>
<table>
<tr><td>First Name : </td><td> <input type="text" name="fname"/> </td> </tr>
<tr><td>Last Name : </td><td> <input type="text" name="lname"/> </td> </tr>
<tr><td>City : </td><td> <input type="text" name="age"/> </td> </tr>
<input type="submit" value="Submit" />
</table>
</form>
</body>
</html>
这是test2.php
<?php
if($_GET)
{
$fname=$_GET['fname'];
$lname=$_GET['lname'];
$age=$_GET['age'];
echo "firstname : ".$fname;
}
?>