0

I have registration page, when user enters some details and click on refresh or back/forward button.Then we have to alert user with modal pop up like: "Are you sure want to leave the page". I've tried some but the alerts are showing in every page.I only need on registration page and no need to refresh alert messages in other pages.

I have added to this code to registration page

componentWillMount()
{
var myEvent = window.attachEvent || window.addEventListener;
var chkevent = window.attachEvent ? 'onbeforeunload' : 'beforeunload';
    myEvent(chkevent, function(e) { 
    var confirmationMessage = 'Are you sure to leave the    page?'; 
(e || window.event).returnValue = confirmationMessage;
return confirmationMessage;
});
}

How can i prevent the refresh alert message in other pages except registration page and how to add custom alert message in refresh/back/forward buttons.

Allu Manikyam
  • 481
  • 1
  • 8
  • 31
  • Potential Solution - https://stackoverflow.com/questions/12381563/how-to-stop-browser-back-button-using-javascript – Bose_geek May 21 '18 at 12:18

1 Answers1

0

You can use prompt in react-router-dom, You may find at react-router-dom document https://reacttraining.com/react-router/core/api/Prompt

The object has a pathname attribute which is the next path by checking it you can figure out if the path is safe. Here is what I'm talking about:

<Prompt message={(params) => 
        params.pathname == '/about' ? "Move away?" : true } />

and also refer this https://codepen.io/anon/pen/XReabZ

dhivya s
  • 294
  • 1
  • 7