javascript - 使用 Ajax 提交表单并将数据插入 MySQL 不起作用

Question

我正在尝试通过 Ajax 使用 PHP 和 MySQL 提交表单，我收到表单已提交但未插入数据的警报:

按照我的代码:

<script>
function myFunction() {
var fname = document.getElementById("fname").value;
var phone = document.getElementById("phone").value;
var faddress = document.getElementById("faddress").value;
var surveyername = document.getElementById("surveyername").value;
var surveyurl = document.getElementById("surveyurl").value;
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'fname1=' + fname + '&phone1=' + phone + '&faddress1=' + faddress + '&surveyername1=' + surveyername + '&surveyurl1=' + surveyurl;
$.ajax({
type: "POST",
url: "index.php",
data: dataString,
cache: false,
success: function(html) {
	alert("Form Submitted");
}
});
return false;
}
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form">
  <label>Name :</label>
  <input id="fname" type="text"><br>
  <label>Phone :</label>
  <input id="phone" type="text">
  <label>Address :</label><br>
  <input id="faddress" type="text">
  <label>Surveyer Name :</label><br>
  <input id="surveyername" type="text">
  <input id="surveyurl" type="hidden" value="survey-url"><br>
  <input id="submit" onclick="myFunction()" type="button" value="Submit">
  <button type="submit" class="btn btn-lg custom-back-color" onclick="myFunction()">Submit form</button>
</div>
<!-- PHP code -->
<?php
// Fetching Values From URL
$fname2 = $_POST['fname1'];
$phone2 = $_POST['phone1'];
$faddress2 = $_POST['faddress1'];
$surveyername2 = $_POST['surveyername1'];
$surveyurl2 = $_POST['surveyurl1'];
$connection = mysqli_connect("localhost", "dbuser", "dbpass"); // Establishing Connection with Server..
if($connection === false){
    die("ERROR: Could not connect. " . mysqli_connect_error());
}
$sql = "INSERT INTO form_element (fname, phone, faddress, surveyername, surveyurl) VALUES ('$fname2', '$phone2', '$faddress2','$surveyername2','$surveyurl2')";
if(mysqli_query($connection, $sql)){
    echo "Records inserted successfully.";
} else{
    echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
}
mysqli_close($connection); // Connection Closed
?>

编辑:

CREATE TABLE form_element(
 fname varchar(255) NOT NULL,
 phone varchar(255) NOT NULL,
 faddress varchar(255) NOT NULL,
 surveyername varchar(255) NOT NULL,
 surveyurl varchar(255) NOT NULL
);

Answer 1

首先，直接将参数写入sql是不好的做法，它可能会导致SQL注入(inject)，你最好使用 preparestatement 设置参数。

就你的问题而言，原因是，你没有将参数直接传递给sql

改变

$sql = "INSERT INTO form_element (fname, phone, faddress, surveyername, surveyurl)
 VALUES ('$fname2', '$phone2', '$faddress2','$surveyername2','$surveyurl2')";

到

$sql = "INSERT INTO form_element (fname, phone, faddress, surveyername, surveyurl) 
     VALUES ('".$fname2."', '".$phone2."', '".$faddress2."','".$surveyername2."','".$surveyurl2."')";