php 如何使用ajax将输入文件数据值发送到php页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24837215/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to send input file data value using ajax to a php page
提问by user3842025
What I want to do is whenever a user selects a picture and click the button it will move the image to a specific folder and save the link to the database user_image column.
我想要做的是每当用户选择图片并单击按钮时，它会将图像移动到特定文件夹并将链接保存到数据库 user_image 列。
My problem is the actual name of the picture is not save in the database column after i click the submit button. example Oppa/upload/thats the value saved in the database no picture file name.
我的问题是在单击提交按钮后，图片的实际名称未保存在数据库列中。例子Oppa/upload/就是保存在数据库中的值没有图片文件名。
I think the value of the file didnt receive by photo.php can anyone help me solve it.
我认为 photo.php 没有收到文件的价值，谁能帮我解决这个问题。
<input type='file' id="imageInput" name="imageInput" accept="image/*" />
<button id="changePicture" name="changePicture">Submit</button>
script:
脚本：
var data = {};
data.imageInput = $('#imageInput').val();
data.email = $('#email').val();
$.ajax({
type: "POST",
url: "Oppa/view/photo.php",
data: data,
cache: false,
success: function (response) {
if (Number(response) == 1)
{
$("#dialog-confirm-changedImage").dialog("open");
}
}
});
return false;
photo.php
照片.php
<?php
include_once('../dbc/database.php');
$db = new Connection();
$db = $db->dbConnect();
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$email = isset($_POST['email']) ? $_POST['email'] : "";
$image = addslashes(file_get_contents($_FILES['imageInput']['tmp_name']));
$image_name = addslashes($_FILES['imageInput']['name']);
$image_size = getimagesize($_FILES['imageInput']['tmp_name']);
move_uploaded_file($_FILES["imageInput"]["tmp_name"], "Oppa/upload/" . $_FILES["imageInput"]["name"]);
$location = "Oppa/upload/" . $_FILES["imageInput"]["name"];
if(!empty($_POST['email'])) {
$q = "UPDATE tbl_user SET user_image = '$location' WHERE user_email= :email ";
$query = $db->prepare($q);
$query->bindParam(':email', $email);
$results = $query->execute();
echo "1";
}
?>
采纳答案by Siva.G ツ
Take a look at this http://malsup.com/jquery/form/#ajaxSubmit.
看看这个http://malsup.com/jquery/form/#ajaxSubmit。
Include that plugin jquery.form.jsand then try this.
包括那个插件jquery.form.js，然后试试这个。
$('#FormID').ajaxSubmit({ //FormID - id of the form.
type: "POST",
url: "Oppa/view/photo.php",
data: $('#FormID').serialize(),
cache: false,
success: function (response) {
if (Number(response) == 1)
{
$("#dialog-confirm-changedImage").dialog("open");
}
}
});
This should work. I'm using it for ajax image upload.
这应该有效。我用它来上传ajax图片。
Thanks.
谢谢。
回答by Karan Adhikari
<input type='file' id="imageInput" name="imageInput" accept="image/*" />
<button id="changePicture" name="changePicture">Submit</button>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
$("#changePicture").click(function(){
var file_name=$("#imageInput").val();
var fileName = $("#imageInput").val();
var fileExtension = fileName.substring(fileName.lastIndexOf('.') + 1);
var base_url = 'Oppa/view/photo.php';
var file_data=$("#imageInput").prop("files")[0];
var form_data=new FormData();
form_data.append("file",file_data);
$.ajax({
type:"POST",
url: base_url,
datatype:'script',
cache:false,
contentType:false,
processData:false,
data:form_data,
success:function(){
//------------
},
error:function(){
//----------
}
});
$("#imageInput").val('');
})
</script>
<?php
include_once('../dbc/database.php');
$db = new Connection();
$db = $db->dbConnect();
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$email = isset($_POST['email']) ? $_POST['email'] : "";
$image = addslashes(file_get_contents($_FILES['file']['tmp_name']));
$image_name = addslashes($_FILES['file']['name']);
$image_size = getimagesize($_FILES['file']['tmp_name']);
move_uploaded_file($_FILES["file"]["tmp_name"], "Oppa/upload/" . $_FILES["file"]["name"]);
$location = "Oppa/upload/" . $_FILES["file"]["name"];
if(!empty($_POST['email'])) {
$q = "UPDATE tbl_user SET user_image = '$location' WHERE user_email= :email ";
$query = $db->prepare($q);
$query->bindParam(':email', $email);
$results = $query->execute();
echo "1";
}
?>
don't forget to like my ans :)
别忘了喜欢我的回答:)
回答by hari
try this,
尝试这个，
var data= false;
if (window.FormData) {
data= new FormData();
}
var email = $('#email').val();
if (formdata) {
data.append("image", $('input[type=file]')[0].files[0]);
data.append("email","+email+");
data.append("fileName",$('input[type=file]')[0].files[0].name);
}
if (data) {
jQuery.ajax({
url: "php/upload.php",
type: "POST",
data: data,//Now you attached form datas with filename also,
processData: false,
contentType: false,
success: function (data) {
alert("Response Data : "+data);
}
});
}
回答by Karan Adhikari
jQuery("#changePicture").click(function(){
jQuery("#changePicture").click(function(){
var file_name=jQuery("#imageInput").val();
var fileName = jQuery("#imageInput").val();
var fileExtension = fileName.substring(fileName.lastIndexOf('.') + 1);
var base_url = 'Oppa/view/photo.php';
var file_data=jQuery("#imageInput").prop("files")[0];
var form_data=new FormData();
form_data.append("file",file_data);
jQuery.ajax({
type:"POST",
url: base_url,
datatype:'script',
cache:false,
contentType:false,
processData:false,
data:form_data,
success:function(){
//------------
},
error:function(){
//----------
}
});
jQuery("#imageInput").val('');
})
i hope this would help for you n don't forget to like my ans
我希望这对你有帮助 不要忘记喜欢我的回答
