通过Ajax serialize()上传PHP图像

时间:2015-06-04 07:48:22

标签: php jquery ajax

通过ajax serialize()上传文件:

<form id="addform" class="form-horizontal" enctype="multipart/form-data" >
<div class="form-group">
    <label for="link" class="control-label col-xs-3">Image</label>
    <div class="col-xs-6">
        <input id="file" name="file" type="file"  class="form-control">
    </div>
</div>
</form>

AJAX CODE使用serialize():

$('#save11').click(function(){      

    $.ajax({                
            type : "POST",
            url : "page/add-journal.php",
            data :$('#addform').serialize(),
            success : function(data)
            {
                alert(data);
                window.location.href="home-page.php";       
            }
    });
});

这里是PHP代码:

<?php
    include '../dbConnection.php';
    $tmp=$_FILES['file']['tmp_name'];
    $serverpath="upload/".$_FILES['file']['name'];
    $file=$_FILES['file']['name'];
    move_uploaded_file($tmp,$serverpath);

    $sql="insert into journal set file='".$file."'";    
    $query=mysql_query($sql);               

?>

仅使用serialize()给我解决方案。如果不是这样,请给我最好的解决方案。

2 个答案:

答案 0 :(得分:2)

我在您的代码中进行了一些更改..您可以使用以下代码使用ajax上传图片

<form id="addform" class="form-horizontal" enctype="multipart/form-data" >
            <div class="form-group">
                <label for="link" class="control-label col-xs-3">Image</label>
                <div class="col-xs-6">
                    <input id="file" name="file" type="file"  class="form-control">
                </div>
                <input type="submit" name="save" value="save" />
            </div>
        </form>
        <script>
            $('#addform').submit(function(e) {
                e.preventDefault();
                var data = new FormData(this); // <-- 'this' is your form element

                $.ajax({
                    url: 'page/add-journal.php',
                    data: data,
                    cache: false,
                    contentType: false,
                    processData: false,
                    type: 'POST',
                    success: function(data) {
                        alert(data);
                        window.location.href = "home-page.php";
                    }

                });
            });
        </script>

注意:

  1. 您没有提供提交表单的方式,因此我提交了一个提交按钮
  2. 您正在使用mysql函数,但现在已经从php正式弃用它们,您应该使用mysqliPDO

答案 1 :(得分:0)

HTML中的表单ID为addform,而ajax中的表单ID为#addformkey。您必须在一个地方更改ID。我怀疑这会起作用。

  

仅使用serialize()

给我解决方案

https://api.jquery.com/serialize/

  

.serialize()方法以标准URL编码表示法创建文本字符串。它可以作用于已选择单个表单控件的jQuery对象,例如<input><textarea><select>$( "input, textarea, select" ).serialize();

我怀疑它可以序列化文件。