Question

我想要做的是每当用户选择图片并单击按钮时，它会将图像移动到特定文件夹并将链接保存到数据库user_image列。

我的问题是单击提交按钮后图片的实际名称未保存在数据库列中。示例Oppa/upload/表示数据库中保存的值没有图片文件名。

我认为photo.php没有收到文件的价值，任何人都可以帮我解决。

<input type='file' id="imageInput" name="imageInput" accept="image/*" />
<button  id="changePicture" name="changePicture">Submit</button>

脚本：

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
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";
}

?>

Answer 1

    <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";
}

?>

不要忘记喜欢我的ans :)。

Answer 2

试试这个，

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);
                    }
                });
            }

Answer 3

看看这个http://malsup.com/jquery/form/#ajaxSubmit。

包含该插件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");
            }
        }
    });

这应该有效。我正在使用它进行ajax图片上传。

感谢。

Answer 4

的jQuery（ “＃changePicture”）。单击（函数（）{

    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('');


    })

我希望这对你有所帮助，不要忘记喜欢我的答案

如何使用ajax将输入文件数据值发送到php页面

4 个答案: