Solved

JavaScript Only for : Exit PopUp, AlertBox, Redirected Page

Posted on 2006-11-09
6
518 Views
Last Modified: 2009-07-29
Hi,
I've been searching through the net and also looking for previous posting questions here but I dont receive an answer like what I want.

On page #1 I want a "javaScript" which will pop an "Alert Box" if visitor close the window.
This "Alert Box" should have options for "OK" and "Cancel".
When this PopUp shown, the main window (page #1) is redirected to another URL (page #2).
If visitor click "Cancel" then he will stay on page #2.
But if he clicks "OK" then he will be redirected to page #3.

I've been searching and find out that this whole functions are happens with combinations of "FrameSet" and "JavaScript".

But I wonder if an expert can help me written the codes for "JavaScript" only (cos I dont like "FrameSet" on my site).

Will this possible ?

By the way, for clear example, please open this site and close it so you'll see the effect that I'm looking for:
http://www.seminarstrategysecrets.com/
0
Comment
Question by:egolddude
  • 3
  • 3
6 Comments
 
LVL 10

Expert Comment

by:dennis_maeder
ID: 17910016
The essence of the page you quote is below.
It does not redirect to a new page. It is stay or close.
It is bad netiquette to drive someone to a page they have not requested.
D

<html>
<head>
<script type='text/javascript'>
function ExitPop() {
 return "my message to you\n\n***************** "
}
</script>
</head>

<body onBeforeUnload="return ExitPop();">
content
</body>
</html>
0
 
LVL 10

Accepted Solution

by:
dennis_maeder earned 500 total points
ID: 17910232
egolddude,
I should add. Both 'pages' are divisions in the same page.
The technique is to toggle the visibility of the alternate divisions in the ExitPop function.
i.e.
<div id='MainDiv' style='display:block;'>
  main content
<div>
<div id='ExitDiv' style='display:none;'>
  exit content
<div>

and include these lines in the function before the  return
  MainDiv.style.display='none';
  ExitDiv.style.display='block';

D
0
 

Author Comment

by:egolddude
ID: 17910245
Thanks, man ...
Your given code really helps me in giving a direction on how the Alert Box should loooks like.

About the redirected page ... actually the page is inside my site too.
So, the 1st page shown an offer and the redirected page is also showing the same offer (only with a little different layout and more words to read).

Can't I do that?  Well, at least I give an offer to the visitors to stay on the current page (the redirected page, so they can read more about the offer if they want to) OR just leave by pressing OK.

Anybody have more solutions?  Perhaps developed from the JavaScript above?
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 

Author Comment

by:egolddude
ID: 17910483
Thanks, Dennis ... You're genius ... :) ... Exactly what I've been looking for.

Well ... though you just forgot to close the DIV Tags ... :)) ...
Which at first causing the EXIT CONTENT not displayed at all ...

After all ... The POINT is yours.

Thanks.
0
 

Author Comment

by:egolddude
ID: 17910684
Mmmmmm ... could you add one more function bro?

I just checked that if I REFRESH the page, the Alert Box show up and the 'ExitDiv' loads.
But when I click OK, it redirected me to the 'MainDiv'

Do you have a solution for this?

So, either REFRESH or CLOSE should have the SAME FUNCTION.

Go ... Go ... GO ... Expert ... :)
0
 
LVL 10

Expert Comment

by:dennis_maeder
ID: 17911822
This should do it, and easy on the superlatives old chap :)

<html>
<head>
<script type='text/javascript'>
//play with popstop state to change behavior
var popstop = true;
function ExitPop() {
 if (popstop == true) {
    popstop = false;
    MainDiv.style.display='none';
    ExitDiv.style.display='block';  return "my message to you\n\n***************** "
  }
}
</script>
</head>

<body onBeforeUnload="return ExitPop();">
<div id='MainDiv' style='display:block;'>
  main content (optional:- program event to set popstop=false - play with popstop state to change behavior)
</div>
<div id='ExitDiv' style='display:none;'>
  exit content
</div>

</body>
</html>
0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

Suggested Solutions

When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now