Creating a Popup Details Page

Here’s the scenario – you have an order page, to view the details of specific orders. Now, from that order page, you’d like to see the details of the customer who made the order, but you don’t want to leave the order page behind.

The answer is a popup page. I know many people do not like popup pages, but for specific purposes, like this one, they can be very useful. To implement this scenario, first, let’s put a label on the page, for the Customer Name:

<asp:Label ID="lblCustName" Runat="server" />

Now, create a function to return a link to the page:

Function ShowCustName(sName as String, CustNum as String)
if sName<>"" then
	Return "<a language=""Javascript"" href=""#"" onClick=""window.open('CustInfo.aspx?custnum=" & _
	CustNum  & "','Cust_Info', 'scrollbars=1,resizable,width=350, height=450');return false;""><b>" & sName & "</b></a>"
end if
End Function

What this function does, is to create a hyperlink to a second page (“CustInfo.aspx”), which will be the popup page, using the Customer # and the Customer name as arguments. The Customer name is only used, however, for the display part of the hyperlink.

The customer number (the value of which is assigned to a variable called pgCustNum), then, is used in the query string, to retrieve the customer details on the second page.

In the Page_Load event of the first page, we’re assuming that there will be a function or query to load all the order information for a specific order, which will include the customer number and name. We won’t go into that, because, that information will look different for each and everyone’s specfic order. However, just after retrieving the order information, we’ll populate the ‘lblCustName‘ label with the function:

lblCustName.text=ShowCustName(CustName, pgCustNum)

Lastly, on the second page, we will retrieve the Customer information. Again, we will not go into the formatting of this information on the page, since you can display this information however you’d wish. But – since this second page (CustInfo.aspx) came from a hyperlink, using a querystring, here’s how we can use it to retrieve the customer’s information.

First, create a global variable for the Customer number, and retrieve the value from the querysting, populating the variable with that querystring value (remember the link on the first page was ‘CustInfo.aspx?custnum=” & CustNum)

<script language="VB" Runat="server">
Dim sCustNum as String
Sub Page_Load(Source as Object, E as EventArgs)
	sCustNum=Request.QueryString("cusnum")
End Sub
</script>

As was noted earlier, the formatting/display of details on the CustInfo page will not be included in this tutorial. However, since we now have captured the customer number in a variable called sCustNum (keep in mind, though this is a string, it can be changed to an integer, depending on your specific information), you can use the variable as a parameter in the database query, in order to retrieve the details for that customer.

Here, you can see, that with a very little work, you can easily setup a popup details page for your website.

Related Posts:

• No Related Posts