HTML/Javascript Input Image Trigger Action on Accept

Viewed 69

I am busy writing a simple Image Input and am trying to get it to show a little GIF while it is processing the Image.

Basic HTML

<input id="input_file" name="file" type="file" />

Main Javascript Trigger

$("#input_file").on("change", function() {
    displayImageLoader();
    uploadImage();
});

function displayImageLoader() {
    // logic removed for testing
    console.log("LOADER");
}

function uploadImage() {
    // logic removed for testing
    console.log("UPLOAD");
}

The minor issue that I'm having is that after the image is selected in the file browser, there is a delay before the on change triggers.

In most cases the delay is longer than the image processing, so the Image is selected, then 1sec/2sec or so delay, then the on change triggers, then the loader is seen for less than second then the image is uploaded.

I'm wondering if it's possible to trigger functions as soon as the file browser has been confirmed (if confirmed)

0 Answers
Related