无法使用带有formdata的ajax上传文件

时间:2014-10-31 12:02:47

标签: ajax

我的表单中有以下代码。 我尝试使用jquery通过ajax上传文件。 表格中的其他数据字段已经提交。但我无法将FILES添加到POST请求中。

这是我的HTML代码:

 <div class="form-group">
      <div class="col-lg-2">
       <label class="lab pull-right">Image:</label>
      </div>
      <div class="col-lg-2">
        <input type="file" name="nimp" required>
      </div>
   </div>

    <div class="form-group">
     <div class="col-lg-2">
       <label class="lab pull-right">Thumb Image:</label>
      </div>
      <div class="col-lg-2">
        <input type="file" name="ntimp"  id="ntimp" required>
      </div>
   </div>

我的JQ代码:

$(document).ready(function(e) {
$('button.submit').click(function(e) {

    e.preventDefault();
    var a=new FormData();

    alert(a);

    $('.edit_form_prod_div').hide(); 
    $.ajax({
                      type:"POST",
                     url:"ep.php",
                    data:a,
                    cahe: false,
                   processData:false,
                   contentType: false,
                   success: function(response){
                   $('.edit_prod_response').html(response)

                     },
                         error:function(response)
                  { alert("Error Occures"); }
                     });
                     $('.edit_prod_response').show();
});
});

1 个答案:

答案 0 :(得分:0)

试用此代码

<form method="POST" enctype="multipart/form-data" id="fileUploadForm">
    <input type="file" name="files"/><br/><br/>
    <input type="submit" value="Submit" id="btnSubmit"/>
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>


<script>

$(document).ready(function ()
{
    $("#btnSubmit").click(function()
    {
        var form = $('#fileUploadForm')[0];
        var data = new FormData(form);

        $.ajax({
            type: "POST",
            enctype: 'multipart/form-data',
            url: "FileUploadHandler",
            data: data,
            processData: false, // Importent
            contentType: false, // Importent
            cache: false,
            timeout: 600000,
            success: function (data)
            { alert("File Uploaded...!")
            }
        });
    }); 

</script>