Modal Popup window at leaving the page

Topic: Modal Popup window at leaving the page

Manuel Remus Stanca free asked 5 years ago

Hi,

I would like to have a script to show a modal popup window when the user try to leave the page either by using history button or any link in the page.

I tried the below code, but I see no results

<script>
$(window).ready(function(){ 

function UnLoadWindow() {
$('#exModal1').modal('shown');
}

window.onbeforeunload = UnLoadWindow; 
}); 
</script>

I have this one, but the browser add its own text, not my text

<script>
function UnLoadWindow() {
return 'I want my text here, not the browser default text.'
}
window.onbeforeunload = UnLoadWindow;
</script>

Thx

Manuel

Add comment

Mikołaj Smoleński staff answered 5 years ago

1 0 Best answer

Hi there,According to this page https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload You can't display modal instead prompt while reloading the page. However You could change the text inside the prompt using the following code:<pre class="brush:js line-numbers language-js"><code class=" language-js">window.addEventListener('beforeunload', function (e) {
 // Cancel the event as stated by the standard.
 e.preventDefault();
 // Chrome requires returnValue to be set.
 e.returnValue = '';
});</code></pre>Best

Please insert min. 20 characters.

Hi there,

According to this page https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload You can't display modal instead prompt while reloading the page. However You could change the text inside the prompt using the following code:

window.addEventListener('beforeunload', function (e) {
  // Cancel the event as stated by the standard.
  e.preventDefault();
  // Chrome requires returnValue to be set.
  e.returnValue = '';
});

Best

Eric Engel free commented 4 years ago

This was deprecated years ago unfortunately. You cannot change the text inside the prompt.

Mikołaj Smoleński staff commented 4 years ago

Thanks @Eric Engel for your remarks. Best regards

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB jQuery
MDB Version: 4.5.10
Device: laptop & phone
Browser: FF & Chrome
OS: Windows 10 x64 Home
Provided sample code: Yes
Provided link: No

Manuel Remus Stanca

7Support score
2Questions 0Answers 0Snippets