php 使用序列化方法上传 AJAX 图像

nzk0hqpo  于 2023-01-29  发布在  PHP
关注(0)|答案(3)|浏览(91)

这里我使用了序列化方法来获取数据,但我没有得到图像,请帮助找到解决方案或给予我替代的序列化方法。

$( "#button" ).click(function(){
    $.ajax({
        type: 'POST',
        url: ajax_url,
        enctype: 'multipart/form-data',     
        data:{

            data_array:$( "#form" ).serialize(),
            action: 'product_add_form_submit'
        },
        success: function (data) {
            alert('Successfully Submitted');
        }
    });
});
qxsslcnc

qxsslcnc1#

您可以上传表单字段与文件如下所述,并遵循评论.

$('#my-form').submit( function( e ) {
    form_data= new FormData($(this)[0]);
    var imgFile = $("file_input_selector")[0]; // change your delector here
    form_data.append("file_name_field", imgFile.files[0]); // change filename field here
    $.ajax({
        url: 'http://host.com/action/',
        type: 'POST',
        data: form_data,
        success: function(data){
            alert(data);
        }
    });
    e.preventDefault();
});
tct7dpnv

tct7dpnv2#

( '#my-form' )
  .submit( function( e ) {
    $.ajax( {
      url: 'http://host.com/action/',
      type: 'POST',
      data: new FormData( this ),
      processData: false,
      contentType: false
    } );
    e.preventDefault();
  } );
vecaoik1

vecaoik13#

//html form

<form action="url" id="addquestionsamepage" class="form-horizontal form-label-left" method="post" enctype="multipart/form-data" accept-charset="utf-8">        

<div class="item form-group">
    <label class="control-label col-md-3 col-sm-3 col-xs-12">Image </label>
    <div class="col-md-6 col-sm-6 col-xs-12">
        <input  class="form-control col-md-7 col-xs-12"  name="image"  id="add_image" type="file">
    </div>
</div>

</form> 

  

//jquery code

$('#addquestionsamepage').submit(function (e) {
        e.preventDefault();
        var form = $("#addquestionsamepage");
        var url = form.attr('action');
        var formData = new FormData(this);
        $.ajax({
            type: "POST",
            url: url,
            data: formData,
            cache:false,
             contentType: false,
             processData: false,
            success: function (data) {
               alert(data);  
            },
            error: function (data) {
               alert(data);
            }
        });
    });

相关问题