Question

I’m trying to reset a form with a confirm window. My html looks like:

<input type="reset" value="Reset" onclick="showReset();"/>

then for my javascript:

function doReset() {
    var formElements = document1.form1.elements;
    for (var i = 0; i < formElements.length; i++) {
        formElements[i].value = "";
        if (formElements[i].checked) {
            formElements[i].checked = false;
        }
    }
}

function showReset() {
    if (window.confirm("Do you really want to reset the form?")) {
        doReset();
    }
}

When I hit cancel on the confirm window, the form still gets reset and I’m not sure why. Thanks.

Answer 1

If I understand the question, the point is to bypass the default behavior and use your function instead. You can prevent the default button action by adding a return false to the showReset() function.

function showReset(e) {
    if (window.confirm("Do you really want to reset the form?")) {
        doReset();
    }
    return false;
}

Also, make sure the onclick handler returns the results of showReset:

<input type="reset" value="Reset" onclick="return showReset();"/>

Alternatively, if you want default browser behavior and just want a confirm dialog, why not use a confirm only? Like so:

<input type="reset" value="Reset" onclick="return window.confirm('Do you really want to reset the form?');"/>

This is just a “what to do”, but if you want to get more info, there’s some good info in these threads:

• event.preventDefault() vs. return false
• What's the effect of adding 'return false' to a click event listener?