Question

我有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>

当我点击提交按钮时，它没有显示任何内容，没有错误，也没有数据库中的更新。

Answer 1

您正确设置了$fname，$lname和$age，但您从不使用它们，而是使用不存在的$_POST个变量。

而不是 ('$_POST[fname]','$_POST[lname]','$_POST[age]')";

您应该使用$_GET个变量，例如

('$fname','$lname','$age')";

我还建议你在将它们添加到数据库时转义字符串。一种可能的解决方案可以是Prepared statements。

Answer 2

尼古拉所说的改变然后改变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;
}
?>

如何在php上使用ajax插入数据库？

2 个答案: