Skip to content Skip to sidebar Skip to footer

How To Upload File Using Jquery Ajax And Php (without Clicking Any Submit Button)

I have a form like this:

<

Solution 1:

Easy, use a change trigger on your input Element and do an ajax-request inside:

$("#image_file_input").change(function() { 
    $.ajax({
        url: "my-target-url.php",
        type: "post",
        dataType: 'json',
        processData: false,
        contentType: false,
        data: {file: $("#image_file_input").val()},
        success: function(text) {
            if(text == "success") {
                alert("Your image was uploaded successfully");
            }
        },
        error: function() {
            alert("An error occured, please try again.");         
        }
    });   
});

Create a url or route and enter it at url: tag (domain/file.php) and then code serversided stuff:

functionprocessFileUpload() {
    if(count($_FILES) > 0) {
        foreach($_FILESas$file) {
            //DO whatever you want with your file, save it in the db or stuff...//$file["name"];//$file["tmp_name"];//Insert here bla blubbecho"success";
        }
    }
    die();
}

Post a Comment for "How To Upload File Using Jquery Ajax And Php (without Clicking Any Submit Button)"