Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

JavaScript Only for : Exit PopUp, AlertBox, Redirected Page

Posted on 2006-11-09
6
Medium Priority
?
636 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 2000 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
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

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

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

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…
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
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…
Suggested Courses

810 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