我正在开发一个向数据库提交信息的 AJAX 表单。当它到达插入函数时，它正在记录一个错误
Posted
技术标签:
【中文标题】我正在开发一个向数据库提交信息的 AJAX 表单。当它到达插入函数时，它正在记录一个错误【英文标题】：I'm developing an AJAX form that submits information to a database. It's logging an error when it reaches the insert function 【发布时间】：2013-12-18 13:06:45 【问题描述】：我整理了一个 ajax 样式的表单，它通过 jQuery 进行了简单的动画验证。一切检查完毕后，它会将内容发布到我的数据库中。或者至少，这就是想法。现在它在函数的最后记录一个错误，而不是插入信息。
它包括：
db.php，连接数据库
scripts.js (+jQuery)，表单验证
index.php、表格等
insert.php，将帖子数据插入数据库
db.php
<?$con = mysql_connect("localhost","db_name","db_pass");
if (!$con)die('Could not connect: ' . mysql_error());
?>
scripts.js
$(document).ready(function ()
$("#submit").click(function (e)
e.preventDefault();
// Tell console that it's started the validation
console.log("Begin Validation");
// Dump post data into variables
var alert = false;
var first = $("#firstname").val();
var last = $("#lastname").val();
var email = $("#email").val();
var phone = $("#phone").val();
var dropdown = $("#dropdown").val();
// Check first name field
if (first.length === 0)
var alert = true;
$("#firstname").addClass("error");
else
$("#firstname").removeClass("error");
// Check last name field
if (last.length === 0)
var alert = true;
$("#lastname").addClass("error");
else
$("#lastname").removeClass("error");
// Check email field
if (email.length < 7 || email.indexOf("@") == "-1" || email.indexOf("@.") != -1 || email.indexOf("-.") != -1 || email.indexOf("_.") != -1 || email.indexOf("..") != -1 || email.indexOf("._") != -1 || email.indexOf(".-") != -1 || email.indexOf(".@") != -1 || email.indexOf("@-") != -1 || email.indexOf("@_") != -1 || email.indexOf("@") == -1 || email.indexOf(".") == -1)
var alert = true;
$("#email").addClass("error");
else
$("#email").removeClass("error");
// Check phone field
if (phone.length === 0)
var alert = true;
$("#phone").addClass("error");
else
$("#phone").removeClass("error");
// Check dropdown field
if ($("#dropdown").val() === 0)
var alert = true;
$("#dropdown").addClass("error");
else
$("#dropdown").removeClass("error");
// If anything returned an error, display the alert dialog
if (alert === true)
$(".formcheck").slideDown(500);
// If no issues were found, disable submit button and proceed to data insertion
if (alert === false)
$(".formcheck").slideUp(500);
$("#submit").attr(
disabled: "true",
value: "Sending Info..."
);
console.log("Finish validation, move on to insert.php");
// Insert the data into the database via php file, echo success message to form
$.post("insert.php", $("#form").serialize(), function (e)
console.log("Post data to insert.php");
if (e == "sent")
console.log("Hide submit button and display success message");
$("#submit").slideUp(500);
$(".formfail").slideUp(500);
console.log("remove submit and errors");
$(".formsuccess").slideDown(500);
console.log("message sent successfully");
else
console.log("something went wrong");
$("#submit").removeAttr("disabled").attr("value", "Submit");
);
);
);
index.php
<? include 'db.php'; ?>
<!doctype html>
<head>
<!-- meta info and such goes here -->
<link rel='stylesheet' href='theme.css' type='text/css' media='all' />
<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='scripts.js'></script>
</head>
<body>
<form action='#submit' method='post' id='form'>
<div class='formsuccess'>Your entry has been submitted; Thank you.</div>
<div class='formerror'>There was a problem submitting the entry.</div>
<div class='formcheck'>Please check the form, something's missing.</div>
<div class='formfail'>There was a problem contacting the server.</div>
<input type="text" name="firstname" id="firstname" tabindex="1" placeholder="First Name">
<input type="text" name="lastname" id="lastname" tabindex="2" placeholder="Last Name">
<input type="text" name="email" id="email" tabindex="3" placeholder="Email">
<input style="display:none" id="email2" name="email2" type="text">
<input type="text" name="phone" id="phone" tabindex="4" placeholder="Phone">
<select name="dropdown" id="dropdown" tabindex="5">
<option value="0">Please select an option...</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<input id="submit" name="submit" type="button" value="Submit" tabindex="6"/>
</body>
</html>
插入.php
<?$con = mysql_connect("localhost","db_name","db_pass");
if (!$con)die('Could not connect: ' . mysql_error());
mysql_select_db("db_name", $con);
//This bit makes the data input secure (preventing things like drop_tables, etc...)
function sanitize($input)
switch(gettype($input))
case 'object':
foreach($input as $key => $variable)
$input->$key = sanitize($variable);
break;
case 'array':
foreach($input as $key => $variable)
$input[$key] = sanitize($variable);
break;
case 'string':
//clean out extra sql queries
//remove poison null byte
//remove blank space at beginning and end of string
$input = mysql_real_escape_string(trim(htmlentities(str_replace(chr(0),'',$input),ENT_QUOTES)));
break;
return $input;
//create an alias for "clean" version of our variable.
$post = sanitize($_POST);
//now use $post['firstname'] instead of $_POST['firstname'], $post has been cleaned.
//INSERT POST DATA INTO TABLES
$sql="INSERT INTO 'db_name'.'table_name' ('firstname', 'lastname', 'phone', 'email', 'dropdown')
VALUES ('".$post['firstname']."','".$post['lastname']."','".$post['phone']."','".$post['email']."','".$post['dropdown']."')";
if (!mysql_query($sql,$con))
die('Error: ' . mysql_error());
echo 'sent';
mysql_close($con);
?>
就是这样（当然，我去掉了品牌位）。就像现在一样，它记录“出了点问题”
这意味着它通过了 JavaScript 验证并成功到达最后一个函数。不幸的是，它无法将信息插入数据库并默认使用 else 语句，它不会将“已发送”消息返回到脚本文件——因此没有成功。
我已经对这个东西进行了几个小时的修改，但无法弄清楚它为什么会失败。
【问题讨论】：
您是否尝试过提醒您在 ajax 成功函数中返回的内容？例如，在这行之后：if (e == "sent") 添加：alert(e); 并告诉我们您看到了什么。
console.log('Something went wrong: ' + e)。还不如输出 DID 出了什么问题，而不是在黑暗中四处乱窜。
在插入insert.php后查看服务器响应。它可能包含 mysql_error() 函数的输出。或者您的回复中有其他字符、换行符、空格，而不仅仅是sent。
很可能e 不仅仅包含sent 或sent 以外的其他内容。
搞定了！，两个问题... 1. 插入“db_name”不正确。我在那里有 db_user 而不是 db_name 。在我更正之后，它转储了一个新错误：“'字段列表'中的未知列'下拉'”...... PROGRESS！，挖掘它并意识到在将字段添加到数据库后我没有在数据库中创建该列表格。添加了它，现在它可以正常工作了。
【参考方案1】：
您需要使用反引号，而不是表/列名称的引号。
$sql="INSERT INTO `db_name`.`table_name` (`firstname`, `lastname`, `phone`, `email`, `dropdown`)
VALUES ('".$post['firstname']."','".$post['lastname']."','".$post['phone']."','".$post['email']."','".$post['dropdown']."')"
或者没有，只是：
$sql="INSERT INTO table_name (firstname, lastname, phone, email, dropdown)
VALUES ('".$post['firstname']."','".$post['lastname']."','".$post['phone']."','".$post['email']."','".$post['dropdown']."')"
我还会丢弃您的 sanitize() 函数和所有 mysql_* 函数，并改为使用参数化查询。查看PDO，类似于：
$db = new PDO('mysql:dbname=db_name;host=127.0.0.1;charset=utf8', 'db_name', 'db_pass');
$db->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
$stmt = $db->prepare('INSERT INTO table (firstname, lastname, phone, email, dropdown) VALUES (:firstname, :lastname, :phone, :email, :dropdown)';
$stmt->execute(array('firstname' => $_POST['firstname'], 'lastname' => $_POST['lastname'],
'phone' => $_POST['phone'], 'email' => $_POST['email'], 'dropdown' => $_POST['dropdown']));
【讨论】：
原来我的问题是在那个 sql INSERT 脚本中有 db_user 而不是 db_name。我已经更新了它，它工作正常。我还听取了您的建议并删除了多余的反引号。我不熟悉 PDO，但我一定会尝试一下。谢谢。【参考方案2】：mysql_real_escape_string 不是转义数据的好方法，您应该使用 PDO，准备好的语句。在 PDO 中，您不必转义数据。 PDO 会处理它。使用 bindParam 在 db 中插入参数化数据。
【讨论】：
以上是关于我正在开发一个向数据库提交信息的 AJAX 表单。当它到达插入函数时，它正在记录一个错误的主要内容，如果未能解决你的问题，请参考以下文章
Django Ajax ModelForm 向 request.POST 提交一个空表单