通过ajax jquery上传文件

时间:2014-07-30 10:33:31

标签: php jquery ajax

我正在尝试使用jquery ajax上传文件输入但不刷新页面。 我的html表单是

 <form name="uploadform" id="uploadform" method="post" enctype="multipart/form-data">
 <div name="profileBiodata" id="profileBiodata" style="display:none">
            <input type="file" id="file" name="file">
            <input type="submit"  id="submit" value="Upload" >
        </div>
</form>

我的脚本是

$(document).ready(function() {

    // process the form
    $('#uploadform').submit(function() {
        var filename = $("#file").val();

        $.ajax({
            url: '../PhpProject1/ProfileBiodataUpload.php',
            dataType: 'json',
            type: 'POST',
            data: {"op": "upload",  "filename": filename},
            success: function(response) {

                if (response.status == "success") {
                    alert("file exists");

                }
                else if (response.status == "failure")

                {
                    alert("file not exists");

                }


            },
            error: function(x, e) {
                if (x.status === 0) {
                    alert('You are offline!!\n Please Check Your Network.');
                } else if (x.status === 404) {
                    alert('Requested URL not found.');
                } else if (x.status === 500) {
                    alert('Internel Server Error - Please try after relogin to the application');
                } else if (e === 'parsererror') {
                    alert('Parsing JSON Request failed.');
                } else if (e === 'timeout') {
                    alert('Request Time out.');
                } else {
                    alert('Unknow Error.\n' + x.responseText);
                }
            }
        });


    });

});

我的php页面是

<?php

if (isset($_POST['filename']))
{
        echo '{"status" : "success"}';
     }

?>

但我收到了输出警报 你离线!! \ n请检查您的网络。 如何解决这个问题。请任何人帮忙。谢谢提前

1 个答案:

答案 0 :(得分:0)

工作正常。以下是修改后的代码。

HTML表单

<form name="uploadform" id="uploadform" method="post" enctype="multipart/form-data">
    <div name="profileBiodata" id="profileBiodata">
        <input type="file" id="file" name="file">
        <input type="submit"  id="submit" value="Upload" >
    </div>
</form>

脚本

$(document).ready(function() {

// process the form
$('#uploadform').submit(function() {
    var filename = $("#file").val();

    $.ajax({
        url: 'ProfileBiodataUpload.php',
        dataType: 'json',
        type: 'POST',
        data: {"op": "upload",  "filename": filename},
        success: function(response) {
            if (response.status == "success") {
                alert("file exists");
            }
            else if (response.status == "failure")
            {
                alert("file not exists");
            }
        },
        error: function(x, e) {
            if (x.status === 0) {
                alert('You are offline!!\n Please Check Your Network.');
            } else if (x.status === 404) {
                alert('Requested URL not found.');
            } else if (x.status === 500) {
                alert('Internel Server Error - Please try after relogin to the application');
            } else if (e === 'parsererror') {
                alert('Parsing JSON Request failed.');
            } else if (e === 'timeout') {
                alert('Request Time out.');
            } else {
                alert('Unknow Error.\n' + x.responseText);
            }
        }
    });
    return false;
});
});

ProfileBiodataUpload.php

<?php
if (isset($_POST['filename']))
{
    echo '{"status" : "success"}';
}
?>