[英]php &mysql and ajax(insert image into crud application)
我需要添加圖像字段到這里,但我不知道這樣做,我添加幾個文本字段,但我無法添加圖像`
<div class="form-group">
<label for="address">Thired step</label>
<input type="text" id="address" placeholder="Thired step" class="form-control"/>
</div>
<div class="form-group">
<!--<form method="POST" action="store_image.php" enctype="multipart/form-data"> -->
<input type="file" name="imagee" id="imagee class="form-control"/>
<!--<input type="submit" name="submit_image" value="Upload"> -->
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" onclick="addRecord()" enctype="multipart/form-data">Add Help</button>
</div>`
這是addRecord.php`
<?php
if(isset($_POST['first_name']))
{
// include Database connection file
include("db_connection.php");
// get values
$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$email = $_POST['email'];
$address=$_POST['address'];
$image=$_FILES['imagee']['name'];
$query = "INSERT INTO users(first_name, last_name, email, address, image) VALUES('$first_name', '$last_name', '$email','$address','$image')";
if (!$result = mysql_query($query)) {
exit(mysql_error());
}
echo "1 Record Added!";
$target="images/".basename($_FILES['imagee']['name']);
if(move_uploaded_file($_FILES['imagee']['tmp_name'],$target)){
$msg="Image uploaded";
}else{
$msg="not uploaded";
}
}
?>`
這是script.js文件`
// Add Record
function addRecord() {
// get values
var first_name = $("#first_name").val();
var last_name = $("#last_name").val();
var email = $("#email").val();
var address=$("#address").val();
var imagee =$("#imagee").val();
//$address=$_POST['address'];
//$image=$_FILES['imagee']['name'];
// Add record
$.post("ajax/addRecord.php", {
first_name: first_name,
last_name: last_name,
email: email,
address:address,
imagee:imagee
}, function (data, status) {
// close the popup
$("#add_new_record_modal").modal("hide");
// read records again
readRecords();
// clear fields from the popup
$("#first_name").val("");
$("#last_name").val("");
$("#email").val("");
$("#address").val("");
$("#imagee").val("");
});
}
我在項目中包含了所有文件,請發給我需要做的更改添加圖像並完成此項目。
`
我真的不知道你要在這里完成什么。 同時取消注釋您的表單標記
<form method="POST" id="image_uploader" enctype="multipart/form-data">
嘗試這個
var formData = new FormData($('#image_uploader')[0]); // This would dynamically grab all contents from your form including images and files.
然后,替換為,
$.ajax({
type: "POST",
url: "ajax/addRecord.php",
data: formData,
//use contentType, processData for sure.
contentType: false,
processData: false,
beforeSend: function() {
//you can add a loading icon or loading message to tell your users something is happening
},
success: function(msg) {
//hide modal on success and load
// close the popup
$("#add_new_record_modal").modal("hide");
// read records again
readRecords();
},
error: function() {
//show error message
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.