DevPinoy.org
A Filipino Developers Community
   
How To: Redirect a user to a page using popups

I was browsing dotnet.org.za today when i stumbled into an interesting problem that Derek Adkins posted on his blog. The problem was about redirecting users to a page to a new blank window(_blank) instead of using the same window to display the redirected page. I don't know the full detail about why you would like to do that approach but i was immediately intrigue on how to solve it since i found that alot of people already viewed the post and no one seems to bother answering it(perhaps nobody really knows how to do it.. just a wild guess :)).

After seeing that post(and opportunity to test my skills), i immediately went to my Visual Studio .NET IDE and started to create a new web project. Upon analysis of his problem, i realized that what he wanted was a way to redirect users to an external site based on a parameter passed to the redirecting page. Another criteria that had in mind was appending parameters to request string since i think he wanted to pass information to the external site base on values set on a session variable.

Now let's start solving. We begin by creating a new ASP.NET page which we would call as RedirectionTest.aspx. For simplicity, we would just hardcode the query string parameters to 3 HtmlLinks on the page. Here's what RedirectionTest.aspx would look like:

<form id="form1" runat="server">
      <div>
         <asp:HyperLink ID="hlRedirect1" runat="server" NavigateUrl="RedirectToSite.aspx?site=1">Redirect 1</asp:HyperLink><br />
         <asp:HyperLink ID="hlRedirect2" runat="server" NavigateUrl="RedirectToSite.aspx?site=2">Redirect 2</asp:HyperLink><br />
         <asp:HyperLink ID="hlRedirect3" runat="server" NavigateUrl="RedirectToSite.aspx">Redirect 3</asp:HyperLink>&nbsp;</div>
     </div>
</form>

As you can see, each hyperlink has a specified NavigateUrl that points to a page called RedirectToSite.aspx. Now lets create the RedirectToSite.aspx page.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RedirectToSite.aspx.cs" Inherits="RedirectToSite" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Redirect to site</title>
    <script type="text/javascript">
    <!--
        function popup(mylink, windowname)
        {
        if (! window.focus)return true;
        var href;
        if (typeof(mylink) == 'string')
           href=mylink;
        else
           href=mylink.href;
        window.open(href, windowname, 'width=800,height=600,scrollbars=yes');
        return false;
        }
    //-->
    </script>
</head>
<body onload="<%= redirectionEvent %>" >
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="lblRedirectStatus" runat="server" Text="Unknown site..."></asp:Label></div>
    </form>
</body>
</html>

As you can see, we have defined a javascript function called popup which would serve as the driver(redirector) for this page. We have also place a Label control called lblRedirectStatus which would serve as the placeholder for information on what site our popup window would be displaying. Another thing to note is the inclusion of a protected string called redirectionEvent that we have embedded on the load event of the html body. The reason behind this is for us to pass the url we would like to redirect to to the javascript when the page loads.

Here is the code listing for our RedirectToSite.aspx:


public partial class RedirectToSite : System.Web.UI.Page
{
   protected string redirectionEvent = "";
   protected void Page_Load(object sender, EventArgs e)
   {
      //our popup call
      string redirectionInfo = "popup('@popurl', 'ad')";
      //the popup url
      string popurl = "";
      //check whether there is a value for our querystring
      if(Request.QueryString["site"] != null)
      {
         //get the siteid
         string siteId = "";
         siteId = Request.QueryString["site"].ToString();

         //if siteid is one then...
         if (siteId == "1") { popurl = "http://www.keithrull.com"; }
         //if siteid is two then
         else if (siteId == "2") { popurl = "http://www.devpinoy.org"; }

         //display our redirect information
         lblRedirectStatus.Text = "Redirecting to " + popurl;
         //replace the @popurl placeholder with the popurl value
         redirectionEvent = redirectionInfo.Replace("@popurl", popurl);
      }
   }
}

Explanation: So what happened??

When a request is made to RedirectToSite.aspx, our page checks if the request includes a query string value called siteId. siteId represents the URL on where we want the user to be redirected by popup. we then pass the value to the popurl and the redirectionInfo string to our protected string redirectionEvent. The redirectionEvent variable is then printed to our page since we have embedded its declaration to our HTML page. The popup function is then triggered by the onLoad event of the HTML body.

I hope this demo helps... although I know there are missing pieces like getting the value from a session variable... but, ei! just modify this code and your off to go!


Posted 08-29-2006 11:53 PM by keithrull
Copyright DevPinoy 2005-2008