Auto submitting a form when user is out of the page

Question

I'm trying to figure how to auto submit a form once the user is out of the page. Is there a way?

Code:

<form class="carform" method="get">
 <input type="hidden" name="number_plate" value="{{ car.number_plate }}">
</form>

So when a user clicks a back button or type in another url, the form will automatically submit the form, so it can send the value inside the form and other views can catch the get method.

EDIT: When the user changes the url or clicks the back button on the browser

get your answer here https://stackoverflow.com/questions/3888902/detect-browser-or-tab-closing — Javad Ebrahimi, May 14 '19 at 10:12
@JavadEbrahimi that's when a user closes their tab, is there a way to submit when the user changes the url or clicks the browser back button — Aaron, May 14 '19 at 10:14
it's not different. when user changes the url or clicks the browser back button it's mean close their tab — Javad Ebrahimi, May 14 '19 at 10:17

score 1 · Accepted Answer · answered May 14 '19 at 10:16

You can basically use window.onbeforeunload event, but it won't trigger on page refresh.

window.onbeforeunload = closingCode;
function closingCode(){
    document.getElementById("form").submit();
    return null; //<-- this prevents the dialog confirm box
}

score 0 · Answer 2 · answered May 14 '19 at 10:35

Try this:

window.addEventListener('beforeunload', async (event) => {
    event.preventDefault();
    event.returnValue = ''; // For chrome

    await submitYourFormFunction();
});

This works well when you refresh page and click back button on the browser.

Auto submitting a form when user is out of the page

2 Answers2