3

How send input type file to image upload file using post method in JavaScript? Blew is the form.

<form action="#" method="post" enctype="multipart/form-data" id="image_upload" name="image_upload">
    <input type="file" name="myFile" id="myFile" onchange="readURL(this);" required>
    <br>
    <img id="blah" src="#" alt="your image" />
    <input type="hidden" name="user_id" id="user_id" value="<?php echo $user_id; ?>">
    <input type="submit" value="Upload">
</form>

Here blow is JavaScript that I have used for post the Form.

$(document).ready(function(){ 
$('#image_upload').submit(function(e){
        e.preventDefault();

        $.post('getfile_provider.php',$('#image_upload').serialize(),function(data){
            alert(data);
        });

    });
});

When i send in this method i get in getfile_provider.php file only the user_id value.

Muhammad Hassaan
  • 7,296
  • 6
  • 30
  • 50
sanji
  • 121
  • 1
  • 14
  • possible duplicate of [How to upload file through Jquery/AJAX](http://stackoverflow.com/questions/19920322/how-to-upload-file-through-jquery-ajax) – Jigar Aug 06 '15 at 06:47

1 Answers1

1

You can use this to sending image file using post method

 var formData = new FormData($("#form")[0]);
            $.ajax({
                url: "getfile_provider.php",
                type: 'POST',
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
            })
            .done(function(data) {
                alert('done');
            });
Saty
  • 22,443
  • 7
  • 33
  • 51
  • This img tag is show Image after file load. But i have tried after you comments. Still is not parsing the value from File load. – sanji Aug 06 '15 at 07:24
  • @sanji its my mistake please check my updated answer!! – Saty Aug 06 '15 at 07:37