我之前提到过我的注册代码。我现在想将图像名称保存到数据库中。图像将使用文件上传进行上传。验证是使用jquery完成的，表单必须使用ajax提交。现在我已经了解到文件上传不能使用ajax执行。这就是我的代码的问题。
以下是我的代码：
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"> </script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script>
function ValidateEmail(email) {
var expr = /^(['w-'.]+)@(('[[0-9]{1,3}'.[0-9]{1,3}'.[0-9]{1,3}'.)| ((['w-]+'.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(']?)$/;
return expr.test(email);
};
$(document).ready(function(){
$('#submit').on('click', function() {
//e.preventDefault();
valid = true;
if ($('#name').val() == '') {
alert ("please enter your name");
//$('#errorMsg1').css('color','red');
//$('#errorMsg1').html('Please enter your name');
//document.getElementById("errorMsg1").innerHTML = "You must enter a name";
valid = false;
}
if ($('#email').val() == '') {
alert ("please enter your email");
//$('#errorMsg2').css('color','red');
//$('#errorMsg2').html('Please enter your emailid');
//document.getElementById("errorMsg2").innerHTML = "You must enter a email";
valid = false;
}
if (!ValidateEmail($("#email").val())) {
alert("Invalid email address.");
//document.getElementById("errorMsg2").innerHTML = "Invalid email address.";
}
if ($('#bday').val() == '') {
alert ("please enter your birth date");
//$('#errorMsg3').css('color','red');
//$('#errorMsg3').html('Please enter your birth date');
//document.getElementById("errorMsg3").innerHTML = "You must enter your birth-date";
valid = false;
}
if ($('#gender').val() == '') {
alert ("please select your gender");
//$('#errorMsg4').css('color','red');
//$('#errorMsg4').html('Please select your gender');
//document.getElementById("errorMsg4").innerHTML = "You must select your gender";
valid = false;
}
if ($('#image').val() == '') {
alert ("please select an image");
//$('#errorMsg5').css('color','red');
//$('#errorMsg5').html('Please select an image');
//document.getElementById("errorMsg5").innerHTML = "You must select an image";
valid = false;
}
});
return false;
$("#multiform").submit(function (e)
{
var formObj=$(this);
var formURL=formObj.attr("action");
var formData=new formData(this);
$ajax({
URL:formURL,
type:'POST',
data:formData,
mimeType:"multipart/form-data",
contentType:false,
cache:false,
processData:false,
success:function(data,textStatus,jqXHR){
},
error:function(jqXHR,textStatus,errorThrown){
}
});
e.preventDefault();
e.unbind();
}
);
return true;
$("#multiform").submit();
});
</script>
</head>
<body>
<form name="multiform" id="multiform" action="save_data.php" method="POST" enctype="multipart/form-data">
<h4>Name:</h4> <input type="text" name="name" id="name" autofocus>
<br><br>
<h4>E-mail:</h4> <input type="text" name="email" id="email" autofocus>
<br><br>
<h4>Birth-date:</h4> <input type="text" name="bday" id="bday" autofocus>
<br><br>
<h4>Gender:</h4>
<input type="radio" name="gender" id="gender" value="female" autofocus>Female
<input type="radio" name="gender" id="gender" value="male" autofocus>Male
<br><br>
Select Image:<input type="file" name="image" id="image"><br><br>
<input type="submit" id="submit" name="submit" value="Submit">
</form>
</body>
</html>
save_data.php：
<!DOCTYPE html>
<html>
<body>
<?php
error_reporting( E_ALL & ~E_NOTICE );
// define variables and set to empty values
$name = $email = $bday = $gender = $image="";
//$image=$_FILES["image"]["name"];
if(isset($_POST['submit'])){
$name = $_POST["name"];
$email = $_POST["email"];
$bday=$_POST["bday"];
$gender = $_POST["gender"];
$image =$_POST["image"];
$servername = "localhost";
$username = "mvs1";
$password = "";
$dbname="scootsy_categories";
$conn = new mysqli($servername, $username, $password,$dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
//echo "Connected successfully";
$sql = "INSERT INTO user_details(name,email,bday,gender,image) VALUES ('$name','$email','$bday','$gender','$image')";
if ($conn->query($sql) === TRUE) {
// echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
//if($name !="" || $email !="" || $bday !="" || $gender !="" || $image !="" )
//{
// $sql="DELETE FROM user_details where name='$name' || email='$email' || bday='$bday' || gender='$gender' || image='$image'";
//}
$conn->close();
}
echo "Successful";
?>
</body>
</html>
您不能将图像保存到数据库中，但可以先保存路径url，然后再使用php将图像保存在文件夹中。要做到这一点，你必须修改你的ajax代码和php文件，因为要做到这一切，我们必须使用$_FILES来提取名称、类型、大小和temp_folder，以便将其移动到过滤器中。
- 重写您的ajax代码
-
使用$_FILES获取文件的属性
<script type="text/javascript"> $('body').on('click','#submit', function() { $.ajax({ type:'POST', url:'save_data.php', data: new FormData($('#your_id_form')[0]), contentType:false, cache:false, processData:false, success:function(upload) { $('#multiform').html(upload): } }); }); </script> <form id="your_id_form" method="POST" action="save_data.php"> <input type="name" placeholder="Your name"> <input type="file" name="file"> <input type="button" id="submit"> </form> <div id="multiform"></div>//save_data.php $name = $_POST['name']; $file_name = $_FILES['file']; $file_size = $file_name['size']; $file_type = $file_name['type']; $file_tmp = $file_name['tmp_name']; list($name,$type) = explode('/',$file_type); $save_temp = $file_tmp; //create a new folder named images into your root page $new_path = 'images/'.$name.$type; //we move the file from the temporal folder to a new folder move_uploaded_file($save_temp, $new_path); $file_url = 'images/'.$file_type; $sql = "INSERT INTO database (name,file_url) VALUES ('$name', '$new_path')"; //do stuffs for connect your query to your database echo 'Uploaded!';？>