regionalmap.aspxReturn to the Documentation page


<%@ Page Language="VB" %>

<%@ import Namespace="System.Data" %>

<%@ import Namespace="System.Data.ODBC" %>

<script runat="server">

‘Declare a public variable [ds] of type DataSet. This variable will be used below and possibly in showMP.aspx and showregionalStats.aspx.’

public ds as new DataSet()

‘Declare a public variable [selectedMap] of type string. This variable will hold the name of the region clicked by the user from the file that called this one - the electionmaps.htm file i.e. the region clicked on the image map [uk2001.gif].’

public selectedMap as string

‘The Page_Load function runs when the page first loads on the client machine.’

‘If the form hasn’t already been submitted then run all the code below.’

if not Page.IsPostBack then

‘Assign the selectedMap variable to the contents of the Querystring. This will be sent across from the file electionmaps.htm when the user either, selects a region from the listbox [picker], clicks a region on the image map [uk2001.gif] OR clicks a HyperLink at the bottom of this page.’

selectedMap = Request.QueryString("map")

‘Start a SELECT...CASE...END SELECT block which looks at what map was actually selected in the selectedMap variable.’

Select Case selectedMap

‘If the map selected was 'Eastern England'....’

Case "Eastern England"

‘Set the text property of the label named 'headerLabel' to "Eastern England".’

headerLabel.Text = "Eastern England"

‘Set the width property of the listbox named 'listBox1' to 200 pixels.’

listBox1.width = Unit.Pixel(200)

‘Set the image to be displayed in the image control named 'electionmap' to ".\maps for 2001 election\640easternengland.gif"’

electionmap.ImageUrl = ".\maps for 2001 election\640easternengland.gif"

‘Set the control's tooltip to "Election map for Eastern England - June 2001"’

electionmap.Tooltip = "Election map for Eastern England - June 2001"

‘Disable the hyperlink [easternengland] at the bottom of the page.’

easternengland.enabled = "false"

‘Similarly for all the other regions of the UK.’

Case "Greater London"
headerLabel.Text = "Greater London"
listBox1.width = Unit.Pixel(230)
electionmap.ImageUrl = ".\maps for 2001 election\640greaterlondon.gif"
electionmap.Tooltip = "Election map for Greater London - June 2001"
greaterlondon.enabled = "false"
Case "ManchesterMerseyside"
headerLabel.Text = "Merseyside & Gr. Manchester"
listBox1.width = Unit.Pixel(200)
electionmap.ImageUrl = ".\maps for 2001 election\640manchester&merseyside.gif"
electionmap.Tooltip = "Election map for Greater Manchester & Merseyside - June 2001"
manchestermerseyside.enabled = "false"
selectedMap = "Merseyside & Gr. Manchester"
Case "Northern England"
headerLabel.Text = "Northern England"
listBox1.width = Unit.Pixel(250)
electionmap.ImageUrl = ".\maps for 2001 election\640northernengland.gif"
electionmap.Tooltip = "Election map for Northern England - June 2001"
northernengland.enabled = "false"
Case "Northern Ireland"
headerLabel.Text = "Northern Ireland"
listBox1.width = Unit.Pixel(180)
electionmap.ImageUrl = ".\maps for 2001 election\640northernireland.gif"
electionmap.Tooltip = "Election map for Northern Ireland - June 2001"
northernireland.enabled = "false"
Case "Scotland"
headerLabel.Text = "Scotland"
listBox1.width = Unit.Pixel(270)
electionmap.ImageUrl = ".\maps for 2001 election\640scotland.gif"
electionmap.Tooltip = "Election map for Scotland - June 2001"
Scotland.enabled = "false"
Case "South Central England"
headerLabel.Text = "South Central England"
listBox1.width = Unit.Pixel(180)
electionmap.ImageUrl = ".\maps for 2001 election\640southcentralengland.gif"
electionmap.Tooltip = "Election map for South Central England - June 2001"
Southcentralengland.enabled = "false"
Case "South-east England"
headerLabel.Text = "South-east England"
listBox1.width = Unit.Pixel(200)
electionmap.ImageUrl = ".\maps for 2001 election\640southeastengland.gif"
electionmap.Tooltip = "Election map for South-east England - June 2001"
Southeastengland.enabled = "false"
Case "South-west England"
headerLabel.Text = "South-west England"
listBox1.width = Unit.Pixel(170)
electionmap.ImageUrl = ".\maps for 2001 election\640southwestengland.gif"
electionmap.Tooltip = "Election map for South-west England - June 2001"
Southwestengland.enabled = "false"
Case "TyneWear"
headerLabel.Text = "Tyne & Wear"
listBox1.width = Unit.Pixel(250)
electionmap.ImageUrl = ".\maps for 2001 election\640tyne&wear.gif"
electionmap.Tooltip = "Election map for Tyne & Wear - June 2001"
tynewear.enabled = "false"
selectedMap = "Tyne & Wear"
Case "Wales"
headerLabel.Text = "Wales"
listBox1.width = Unit.Pixel(230)
electionmap.ImageUrl = ".\maps for 2001 election\640wales.gif"
electionmap.Tooltip = "Election map for Wales - June 2001"
wales.enabled = "false"
Case "West Central England"
headerLabel.Text = "West Central England"
listBox1.width = Unit.Pixel(180)
electionmap.ImageUrl = ".\maps for 2001 election\640westcentralengland.gif"
electionmap.Tooltip = "Election map for West Central England - June 2001"
westcentralengland.enabled = "false"
Case "WestSouthYorkshire"
headerLabel.Text = "West & South Yorkshire"
listBox1.width = Unit.Pixel(200)
electionmap.ImageUrl = ".\maps for 2001 election\640west&southyorkshire.gif"
electionmap.Tooltip = "Election map for West & South Yorkshire - June 2001"
westsouthyorkshire.enabled = "false"
selectedMap = "West & South Yorkshire"
Case "West Midlands"
headerLabel.Text = "West Midlands"
listBox1.width = Unit.Pixel(250)
electionmap.ImageUrl = ".\maps for 2001 election\640westmidlands.gif"
electionmap.Tooltip = "Election map for the West Midlands - June 2001"
westmidlands.enabled = "false"

‘Ends the SELECT...CASE...END SELECT block.’

End Select


end if

‘Create a Session variable named ‘picked’ which will keep track of what the user selected in the listbox [listBox1]. This session variable is given to the showMP and showregionalStats aspx files if they are called from regionalmap.aspx by the user – see more on this below.’

Session("picked") = listBox1.selectedItem.Text

‘The text on the button [showConstituency] changes to reflect the constituency chosen by the user from the listbox [listBox1].’

showConstituency.Text = "Click to see " & Session("picked")

‘The bindData function is called once before the page first loads onto the client machine.’

‘The query string Access2000 selects all the constituencies which are situated in the region selected – held by the string variable [selectedMap].’

Dim Access2000 as string = "Select * from fullresults where region='" & selectedMap & "' order by constituency"

Dim MyConn as New ODBCConnection(ConfigurationSettings.AppSettings("strConn"))

‘An ODBCDataAdapter object [Cmd] is declared which uses the parameters Access2000 and MyConn to retrieve data from the data store.’

Dim Cmd as New ODBCDataAdapter(Access2000,MyConn)

‘The Fill method puts the retrieved data into a dataset [ds] – it was defined at the top of the code as a public variable.’


‘The listbox [listBox1] is filled with just the constituency field from the dataset and set to the first constituency i.e. if Eastern England was selected as the region then Basildon would be displayed at the top of the control.’





listBox1.SelectedIndex = 0

‘The number of items in the listbox [listBox1] are assigned to a session variable named ‘numberofseats’. Similarly session variables hold the region and the dataset in case they are needed by showMP.aspx or showregionalStats.aspx. See the documentation for those files for more on this.’

Session("numberofseats") = listBox1.items.count



‘An attribute is added to the button [showConstituency]. If the user clicks the button ‘Click to see ...’ the javascript function will open a second window on the screen positioned 10 pixels in from the top left-hand corner of the screen. The showMP.aspx will appear within this window displaying the result from the constituency selected within the listbox [listBox1].’

showConstituency.Attributes.Add("onclick", "'showMP.aspx',null,'left=10,top=10,scrollbars')")

‘Similarly clicking the button ‘Stats’ will open a second window showing the compiled regional statistics for the region currently displayed on the screen – see more in showregionalStats.aspx.’

showregionalStats.Attributes.Add("onclick", "'showregionalStats.aspx',null,'width=350,height=270,left=10,top=10')")

‘Tidy up the variables before ending the function.’



‘A Linkbutton web control redirects the user back to the election maps page.’


‘The switchMap function is run when the user clicks the regional map on the screen. It'll switch a smaller map for a larger version and vice versa.’

‘Declare a string variable [fileString] which is assigned the contents of the ImageUrl property of the ImageButton control [electionmap] i.e. something like '.\maps for 2001 election\640greaterlondon.gif'.’

dim fileString as string = electionmap.ImageUrl

‘Declare a variable of type string [largerMapName].’

dim largerMapName as string

‘Declare sixPos as an integer.’

dim sixPos as integer

‘Use the InStr function to check if there is a '6' within the fileString variable - if there is, the function will return a number greater than 0, but if no '6' is present then it will return 0.’

if Instr(1,fileString,"6") <> 0 then

‘The position of the '6' within the ImageUrl or fileString variable is assigned to the integer variable [sixPos].’

sixPos = InStr(1,fileString,"6")

‘The Session variable [smallerMapName] contains the filename of the smaller version of the map which starts with '640....gif'. This filename is extracted from the fileString variable using the mid function.’

Session("smallerMapName") = mid(fileString,sixPos)

‘The filename of the larger version of the map is extracted from the fileString using the mid function and assigned to the string variable [largerMapName]. The 'sixPos+3' parameter starts the mid function after the first three digits of the filename, which should be '640' as in 640greaterlondon.gif, for example.’

largerMapName = mid(fileString,sixPos+3)

‘Set the ImageUrl property of the ImageButton control [electionmap] to the path '.\maps for 2001 election\' plus the contents of the variable [largerMapName].’

electionmap.ImageUrl =".\maps for 2001 election\" + largerMapName

‘Set the text property of the Label control [switchimage] to 'Click map for smaller image'.’

switchimage.Text ="Click map for smaller image"

‘Otherwise, if the InStr function does not find a '6' within the fileString/ImageUrl property then...’


‘Set the ImageUrl property of the ImageButton control [electionmap] to the path '.\maps for 2001 election\' plus the contents of the Session variable [smallerMapName].’

electionmap.ImageUrl = ".\maps for 2001 election\" + Session("smallerMapName")

‘Set the text property of the Label control [switchimage] to 'Click map for larger image'.’

switchimage.Text ="Click map for larger image"

end if




<link href=".\otherfiles\election2001.css" type="text/css" rel="stylesheet">


‘A listbox [listBox1], two buttons [showConstituency and showregionalStats], a linkbutton [LinkToEdit], an ImageButton control [electionmap] displaying a regional map and a Label [switchimage] are displayed on the page. The AutoPostBack property of the listbox is set to “true” so that the text on the button [showConstituency] can change depending on which constituency has been selected by the user.’

<body bgcolor="white">

<form id="form1" runat="server">

<table width="100%">

<tr><td><H3>Election maps - <asp:Label id="headerLabel" runat="server"></asp:Label></H3></td><td align=right valign=top><asp:LinkButton id="LinkToEdit" onclick="linkToMapsMenu" runat="server" Text="Return to the Maps menu"></asp:LinkButton></td></tr>

<tr><td valign="top" colspan="2"><asp:ListBox runat="server" SelectionMode="Single" AutoPostBack="true" id="listBox1" width="200" rows="1"></asp:ListBox>&nbsp;<asp:Button runat="server" Text="Click to select a constituency" id="showConstituency"></asp:Button>&nbsp;<asp:Button runat="server" id="showregionalStats" Text="Stats"></asp:Button><br><br></td></tr>

<tr><td colspan="2" align="middle"><asp:Label id="switchimage" runat="server" text="Click map for larger image" forecolor="Blue"></asp:Label><br /><asp:ImageButton id="electionmap" onclick="switchmap" runat="server" ></asp:ImageButton></td></tr>


‘A second table [mapfooter] displays hyperlinks to all the other maps, allowing easy selection without having to constantly return to the maps menu page.

The NavigateURL attribute within each HyperLink tag uses a javascript function to select another map - e.g. NavigateURL="javascript:self.location='regionalmap.aspx?map=Eastern England'". The '?map=Eastern England' part of the code is known as the QueryString and can be accessed by ASP.NET both from within this page and other pages using 'Request.QueryString("map")' - returning, in this example, 'Eastern England'. The only problem is that the '&' character cannot be part of this querystring - '?map=TyneWear' gets sent NOT '?map=Tyne & Wear' - otherwise an error will occur. See the Case "TyneWear" block of the Page_Load function above for how to work around this limitation.’


<table id="mapfooter">

<tr><td><asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=Eastern England'" tooltip="Click to show Eastern England" id="easternengland">Eastern England</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=Greater London'" tooltip="Click to show Greater London" id="greaterlondon">Greater London</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=ManchesterMerseyside'" tooltip="Click to show Merseyside & Manchester" id="merseysidemanchester">Merseyside & Manchester</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=Northern England'" tooltip="Click to show Northern England" id="northernengland">Northern England</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=Northern Ireland'" tooltip="Click to show Northern Ireland" id="northernireland">Northern Ireland</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=Scotland'" tooltip="Click to show Scotland" id="scotland">Scotland</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=South Central England'" tooltip="Click to show South Central England" id="southcentralengland">South Central England</asp:HyperLink></td></tr>

<tr><td><asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=South-east England'" tooltip="Click to show South-east England" id="southeastengland">South-east England</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=South-west England'" tooltip="Click to show South-west England" id="southwestengland">South-west England</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=TyneWear'" tooltip="Click to show Tyne & Wear" id="tynewear">Tyne & Wear</asp:HyperLink> | >asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=Wales'" tooltip="Click to show Wales" id="wales">Wales</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=West Central England'" tooltip="Click to show West Central England" id="westcentralengland">West Central England</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=WestSouthYorkshire'" tooltip="Click to show West & South Yorkshire" id="westsouthyorkshire">West & South Yorkshire</asp:HyperLink> | <asp:HyperLink runat="server" NavigateURL="javascript:self.location='regionalmap.aspx?map=West Midlands'" tooltip="Click to show West Midlands" id="westmidlands">West Midlands</asp:HyperLink></td></tr>