Is it possible to clear a form and reset (reload) the page with one button?

Question

I've got a form on a page where the user types something in and then a result is returned and displayed on the page. Is it possible for me to have a button that will both, clear the search results and the form simultaneously?

I know that you can use the <input type="reset" value="Reset"/> button on the form to reset the form and also use the following code, to reload the page.

<input type="button" value="Clear Results" onClick="window.location.reload()">

Is it possible to have the button do both things i.e. clear the search results and reset the form? Can it be done using JavaScript, if so how?

Thanks

Answer 1

If you want the functionality of both of the snippets you posted, you can simply combine them.

<input type="reset" value="Reset" onClick="window.location.reload()">

Answer 2

I'm a fan of @MikeyHogarth's suggestion since it's called regardless of how the page is refreshed. This is one of those rare times that I find straight javascript to be simpler than jquery so I just wanted to add the code for that.

$(document).ready(function () {
    resetForms();
});

function resetForms() {
    document.forms['myFormName'].reset();
}

This uses the form name attribute, and if you'd prefer using the form id attribute use this instead:

document.getElementById('myFormId').reset();