On Click: Open a Pop-up Div on a Different Page

Question

On page1.php I have a click event that causes the user to be redirected to page2.php. It goes something like this:

$("#someButton").click(function() {
    window.location = "page2.php";
});

And that works great. But what I really want is to open a hidden, UI-blocking <div> on page2. The user can already open this <div> manually by clicking another button on page2, that goes something like this:

$('#someOtherButton').click(function() {
   $("#pageContainer").block({message: $("#theDivIWant2See")});
});

Can I make a click event from the JavaScript on one page call the JavaScript on another? Or will I need to add in some HTML-parsing to pass information between pages? (I'm not looking for a JavaScript hand-out here, just a strategy to help me move forward.)

Answer 1

When you redirect from the first page, add a querystring value in your url. and in the second page, using your server side page language, set in in a hidden field and in the document ready event check the value of that hidden field. If the value is expected, call a javascript function to show the popup.

Some thing like this

$("#someButton").click(function() {
    window.location = "page2.php?showpopup=yes";
});

and in page2.php set it (forgive for errors, i am not a php guy)

<input type='<?php $_GET["showpopup"] ?>' id='hdnShow' />

and in the script

$(function(){
  if($("#hdnShow").val()=="yes")
  {
    //Call here the method to show pop up
  }
});

Answer 2

You need to do your stuff when DOM for page2 is ready. You can use jQuery's ready function for that.

$(document).ready(function() { // put code for showing your div here });

Hope that helps.

Answer 3

Could you pass a query string argument or assign a cookie that the other page could then check when the document loads? If the value exists then present a modal dialog (eg jQuery UI Modal Popup)

http://jqueryui.com/demos/dialog/