Categories: Snippets

File Upload in Ajax

$("form#data").submit(function(){

    var formData = new FormData($(this)[0]);

    $.ajax({
        url: window.location.pathname,
        type: 'POST',
        data: formData,
        async: false,
        success: function (data) {
            alert(data)
        },
        cache: false,
        contentType: false,
        processData: false
    });

    return false;
});

Short Version

$("form#data").submit(function() {
    var formData = new FormData($(this)[0]);
    $.post($(this).attr("action"), formData, function(data) {
        alert(data);
    });
    return false;
});
$.ajax({
    url: 'php/upload.php',
    data: $('#file').attr('files'),
    cache: false,
    contentType: 'multipart/form-data',
    processData: false,
    type: 'POST',
    success: function(data){
        alert(data);
    }
});

 

Share

Recent Posts

Selecting Elements in jQuery (jQuery Selectors)

To collect a group of elements, we pass the selector to the jQuery function using…

6 years ago

jQuery library Introduction

jQuery is a lightweight, "write less, do more", JavaScript library. The purpose of jQuery is…

6 years ago

Adjust li width fit with ul width of the outer div/body

HTML:- [crayon-67a5b56e42634813405240/] CSS:- [crayon-67a5b56e42637985598881/] JavaScript:- [crayon-67a5b56e42639717527217/]  

6 years ago

Customize Input Box using jQuery

Prevent users typing special characters in text box, textarea, etc. [crayon-67a5b56e42707215620014/] ^[a-zA-Z]+$ Alphabets ^[a-zA-Z\s]+$ Alphabets…

6 years ago

JavaScript simple form validation with example

Any interactive web site has form input - a place where the users input different…

6 years ago

Clear the browser cache of CSS or JavaScript Using Javascript

[crayon-67a5b56e4295a757311501/]  

6 years ago