[enter image description here][1] **add.php**
I am not sure that my data is inserted through ajax or not, can anyone solve my issue.
这是我的 add.php 文件我在数据库中插入数据,首先我已将数据库连接文件包含在此文件中,使用POST方法使用 mysqli_real_escape_string >提交数据strong>从字符串中删除特殊字符。检查空字段,链接到上一页,显示成功消息。
<html>
<head>
<title>Add Data</title>
</head>
<body>
<?php
//including the database connection file
include_once("config.php");
$name = $_POST['name'];
$age = $_POST['age'];
$email = $_POST['email'];
// checking empty fields
if(empty($name) || empty($age) || empty($email)) {
if(empty($name)) {
echo "<font color='red'>Name field is empty.</font><br/>";
}
if(empty($age)) {
echo "<font color='red'>Age field is empty.</font><br/>";
}
if(empty($email)) {
echo "<font color='red'>Email field is empty.</font><br/>";
}
//link to the previous page
echo "<br/><a href='javascript:self.history.back();'>Go Back</a>";
} else {
// if all the fields are filled (not empty)
//insert data to database
$result = mysqli_query($mysqli, "INSERT INTO users(name,age,email) VALUES('$name','$age','$email')");
//display success message
//echo "<font color='green'>Data added successfully.";
//echo "<br/><a href='index.php'>View Result</a>";
}
?>
</body>
</html>
**add.html**
In this file i have included all my js file creating a small table for name, age, email. my method is post. i am unable to do this task first time i am using ajax without ajax i insert data many times.
I am not sure that my data is inserted through ajax or not, can anyone solve my issue.
<html>
<head>
<title>Add Data</title>
<script src="style/jquery-3.2.1.js"></script>
<script src="style/insert.js"></script>
</head>
<body>
<a href="index.php">Home</a>
<br/><br/>
<p id="alert"><span id="show"></span></p>
<table align="center" width="25%" border="0">
<tr>
<td>Name</td>
<td><input type="text" name="name" id="name"></td>
</tr>
<tr>
<td>Age</td>
<td><input type="text" name="age" id="age"></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email" id="email"></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="Submit" id="submit" value="Add"></td>
</tr>
</table>
</body>
</html>
**insert.js**
In this file save input value in variable, my type is POST url is add.php, success function is result, my data is inserted but i am not sure that is this through AJAX or not.
I am not sure that my data is inserted in database through ajax or not, can anyone solve my issue.
$(document).ready(function(e) {
$('#submit').click(function()
{
var name = $('#name').val(); //save input value in variable
var age = $('#age').val();
var email = $('#email').val();
$.ajax({
data :{name:name,age:age,email:email},
url :"add.php", //php page URL where we post this data to save in database
type :'POST',
success: function(data){
alert("Form submitted");
$('#name').val("");
$('#age').val("");
$('#email').val("");
}
})
});
});
答案 0 :(得分:1)
您的数据是使用简单的PHP而不是通过ajax插入的。 因为你在ajax中得到输入值(“#name”)表示输入id,但你没有在输入字段中定义id属性。
答案 1 :(得分:1)
这应该有效:
$(document).ready(function() {
$('#submit').click(function(event){
event.preventDefault();
$.ajax({
type:'POST',
data: $(this).serialize(),
url:"add.php", //php page URL where we post this data to save in database
success: function(result){
$('#alert').show();
$('#show').html(result);
}
})
});
});
preventDefault
的额外调用将停止正常的回发
发生(这将是您的提交按钮的正常行为,无论JS事件处理程序如何)。id="name"
(for
实例)在你的文本框上工作。但是更简单的方法
获取所有表单数据只是使用jQuery的serialize()
方法,如上所述。$.ajax
而不是$ajax
)。同时,一种简单的方法来判断它是否是一个ajax请求是你的警报是否显示。如果不是,该页面是否完整回发?或者是否存在某种ajax错误(在浏览器的开发人员工具中 - 控制台和网络选项卡)?也许可以在线学习关于调试JavaScript和ajax的教程,它可能对你有帮助。
P.S。使用mysqli_real_escape_string并不能完全安全地防止SQL注入攻击等。最好的解决方案是使用预准备语句和参数化查询。 http://bobby-tables.com解释了风险,并向您展示了如何使用PHP和mysqli安全地编写查询。