When the load_upload() function gets executed, I want an explorer window to automatically open, so the user can select a file ($(imageFileInput).click();), and when a file is selected, I want the form to submit automatically.
The problem is that, when the form is generated dynamically as seen below, changes are somehow not detected. This seems to make it impossible to automatically submit the form when the value of imageFile changes.
How could I automatically submit the form this way? Any help is much appreciated!
function load_upload() {
var form = document.createElement('form');
form.method = "POST";
form.action = "image_upload_process.php";
form.id = 'imageForm';
var imageFileInput = document.createElement('input');
imageFileInput.type = "file";
imageFileInput.id = 'imageFile';
$(imageFileInput).click();
form.appendChild(imageFileInput);
document.body.appendChild(form);
};
My change event:
jQuery(document).ready(function($) {
document.getElementById("imageFile").onchange = function() {
document.getElementById("imageForm").submit();
};
});
