CODEWITHSUNDEEP
javascripthtmlajax
Me 4U
Me 4U

Reputation: 276

Javascript How to trigger a function when we User Tries to Exit or Refresh the Page

When a user tries to exit the page after reading price of the product, i want to offer them 1st discount.

  1. If they select 'YES' they buy the product instead of closing the window, if they select 'NO' then i would make 2nd discount offer and this time it will be the last offer.

  2. If they click 'NO' again even second time, his browser will close or else he would buy the product at the given 2nd discount price.

My Example is illustrated below:

<script type="text/javascript">
function getOffers()
{
  var question1 = confirm("Wait! we are now offering this Product in $25.00, buy it?");
  if(question1 == 'true')
  {
        alert('You have purchased this product for $25.00');
  }
  else
  {
        var question2 = confirm("Wait! we would like to make one Final Offer, price of Product in $15.00, buy it?");
        if(question2 == true)
        {
              alert('You have purchased this product for $15.00');
        }
        else
        {
              //Close this window
        }
  }
}
</script>

My question is, how can i trigger this function when user tries to exit (or) refresh the page.

Additional INFO:

I have rewritten the code and trying to fix the annoying page load popup, can any one suggest me on this?

<script type="text/javascript">
function getOffers()
{
  //alert(firrsTime);
  if(firstTime == 'no')
  {
      var question1 = confirm("Wait! we are now offering this Product in $25.00, buy it?");
      if(question1 == 'true')
      {
            alert('You have purchased this product for $25.00');
      }
      else
      {
            var question2 = confirm("Wait! we would like to make one Final Offer, price of Product in $15.00, buy it?");
            if(question2 == true)
            {
                  alert('You have purchased this product for $15.00');
            }
            else
            {
                  //Close this window
            }
      }
  }
}

window.onunload = function(){
    firstTime = 'no';
    getOffers();
}
window.onload = function(){
    firstTime = 'yes';
    getOffers();
}
</script>

I am trying to pass a global variable 'firstTime' to check if it is from onLoad then dont display offer if it is from onUnload then display offer. Is there any solution on this problem?

Upvotes: 0

Views: 226

Answers (2)

eric.itzhak
eric.itzhak

Reputation: 16072

Use the onunload and onload.

window.onunload = function(){getOffers();}
window.onload = function(){getOffers();}

Though it will show it when user first loads the page, so i wouldn't recommend on doing that.

About the way to distnguish between First load and refresh, Have not tried this, but i found this code somewhere :

    function OnCrmPageLoad()
{
   //bind to the onsave event
   crmForm.attachEvent(“onsave”,OnCrmPageSave);

   if (crmForm.new_ispostback.DataValue ==  true)
   {
           //form was saved
           //reset the field
            crmForm.new_ispostback.DataValue = false;
   }
}

function OnCrmPageSave()
{
    // validate form if needed
    crmForm.new_ispostback.DataValue = event.returnValue = true;
    crmForm.new_ispostback.ForceSubmit = true;
     return true;
}

Play around with it.

Upvotes: 3

Sagiv Ofek
Sagiv Ofek

Reputation: 25280

<body onunload="OnUnload()">

then 

function OnUnload()
{
   //put code here
}

Upvotes: 3

Related Questions