Monday, September 15, 2014

Ajax- submit form using ajax (With file/ image)

submit form (With file/ image) using ajax



<form action="#" name="uploader1" method="post" enctype="multipart/form-data" id="MyUploadForm">
    <span class="img1">Image 1</span><input name="file_upload" id="imageInput" type="file" />
    <input type="submit" name="submit"/>
    <span id="success1"></span>
</form>

<script type="text/javascript">
jQuery("form[name='uploader1']").submit(function(e) {
        var formData = new FormData(jQuery(this)[0]);

        jQuery.ajax({
            url: "http://your-domain/processupload.php",
            type: "POST",
            data: formData,
            async: false,
            success: function (msg) {
               // alert(msg)
                jQuery( "#success1" ).html(msg);
            },
            cache: false,
            contentType: false,
            processData: false
        });

        e.preventDefault();
    });
</script>
Note: Please be sure, jQuery libary has included for the page.

Njoy the day :) :)

No comments :

Post a Comment