Question

I am working on an image upload site. When the user uploads the images with no problems, it save the image in 4 different sizes inside 4 different folders. After that, they are redirected to same page with new content. Now they are going to crop the image. The Image crop functions work fine. I’ve made a function to check if the user leaves the site. If they do, the 3 functions will delete the 4 stored images by an AJAX script.

Code:

function unfinished(album, img) {
    window.onbeforeunload = function(e) {
        e = e || window.event;
        var response = '';
        var xmlhttp;
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                response = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", "incl/unfinished.php?a=" + album + "&i=" + img, true);
        xmlhttp.send();
        // For IE and Firefox prior to version 4
        if (e) {
            e.returnValue = response;
        }
        // For Safari
        return response;
    }
}

My problem is, that this function is also triggered when they click the “save crop” button. And of course it’s not what I want.

Any solutions to how to make the function not popup when the save button is clicked?

If it matters, I run the unfinished function by:

onload='onfinished("$nameonalbum","Filename")'

My save crop html code:

input type="submit" name="upload_thumbnail" value="Save crop" id="save_thumb"

Any help is welcome. Thank you for the patience and understanding.

Answer 1

I had to do something similar to you in one case, so I created a variable unload = true and the start of the page, and then instead of doing <input type="submit" I changed it to <input type="button" onclick="runFunction();" and then in my

function runFunction() {
unload = false;
$('#form').submit();
};

then I would add if(unload) { ...do stuff here } in the onBeforeUnload()