合并上传文件并发送其他字段值在ajax请求

问题描述：

我想要能够获得#posthash输入的val以及上传文件。合并上传文件并发送其他字段值在ajax请求

我想能够使用formData.append('newattachment', $('input[type=file]')[0].files[0]);

而且$('#posthash').val()

如何以往如果使用$('#posthash').val()以及它使形式抛出上传错误，如果同时使用。 You did not select a file to upload.

问题我怎样才能得到我的帖子哈希VAL并上传，后在同一时间？

<script type="text/javascript"> 
$('#newattachment').on('click', function(e){ 
    var formData = new FormData(); 
    formData.append('newattachment', $('input[type=file]')[0].files[0]); 
    $.ajax({ 
     type: 'post', 
     url: "<?php echo base_url('newthread/attachments');?>", 
     data: { 
      formData, 
      posthash: $('#posthash').val() 
     }, 
     cache: false, 
     contentType: false, 
     processData: false, 
     success: function(response){ 
      if (response.processed) { 

      } else { 

       $('#errors').append('<div class="upload_errors"></div>'); 
       $(".upload_errors").html(response.upload_errors); 

      } 
     } 
    }); 

    e.preventDefault(); 
}); 
</script>

HTML

<?php echo form_open_multipart($action, array('id' => 'form-post'));?> 

<div class="container"> 

<div class="row"> 
<div class="col-lg-12 col-md-12 col-sm-12" id="errors"> 
</div> 
</div> 

<div class="row"> 
<div class="col-lg-12 col-md-12 col-sm-12" id="upload_data"> 
</div> 
</div> 

<div class="row"> 

<div class="col-lg-3 col-md-3 col-sm-12"> 
<div class="well"> 

</div> 
</div> 

<div class="col-lg-9 col-md-9 col-sm-12"> 

<input type="hidden" name="posthash" id="posthash" value="<?php echo $posthash;?>"> 

<div class="panel panel-default"> 

<div class="panel-heading"> 

</div> 

<div class="panel-body"> 

<div id="message" contenteditable="true" style="width: 100%; height: 344px; overflow: auto;"></div> 

</div> 

<div class="panel-footer"> 
<div class="row"> 
<div class="col-lg-6"> 
<div class="clearfix" style="padding-top: 6px;"> 
<div class="pull-left"> 
<label>New Attachment:</label> 
</div> 
<div class="pull-right"> 
<input name="attachment" id="attachment" size="30" class="fileupload" type="file"> 
</div> 
</div> 
</div> 
<div class="col-lg-6 text-right"> 
<input class="btn btn-default" name="newattachment" id="newattachment" value="Add Attachment" type="button" /> 
</div> 
</div> 
</div> 

</div> 

<br/> 

<?php if ($attachments) {?> 
    <?php foreach ($attachments as $attachment) {?> 
     <ul> 
     <li> 
      <img src="<?php echo base_url('uploads/' . $attachment['attachname']);?>" width="150" height="150"> 
     </li> 
     </ul> 
    <?php }?> 
<?php }?> 

</div> 

</div> 

</div> 

<?php echo form_close();?> 

<script type="text/javascript"> 
$('#newattachment').on('click', function(e){ 
    var formData = new FormData(); 
    formData.append('newattachment', $('input[type=file]')[0].files[0]); 
    $.ajax({ 
     type: 'post', 
     url: "<?php echo base_url('newthread/attachments');?>", 
     data: { 
      formData, 
      posthash: $('#posthash').val() 
     }, 
     cache: false, 
     contentType: false, 
     processData: false, 
     success: function(response){ 
      if (response.processed) { 

      } else { 

       $('#errors').append('<div class="upload_errors"></div>'); 
       $(".upload_errors").html(response.upload_errors); 

      } 
     } 
    }); 

    e.preventDefault(); 
}); 
</script>

答

如果使用FormData()为你发送给服务器（在你的Ajax请求）的数据，必须使用只有这个对象发送数据：

var formData = new FormData(); 
formData.append('newattachment', $('input[type=file]')[0].files[0]); 
formData.append('posthash', $('#posthash').val());

而且你的$.ajax内部电话：

$.ajax({ 
    type: 'post', 
    url: "", 
    data: formData, 
    ... 
});

合并上传文件并发送其他字段值在ajax请求

相关推荐