dobbinjp
asked on
refresh multiview with a button
I have a page with traffic cameras for five cities in Tennessee. There is a drop-down list with city names and I am using AJAX update panels with a multiview (each view contains a web user control with that city's camera images) so that when Chattanooga is selected, Chattanooga's view comes up (via asynchronous triggers).
The problem is refreshing the images...since the page load event defaults to Nashville, when someone hits the refresh button in their browser, it goes back to Nashville regardless of what city they were viewing. I added a button to the page called "refresh images" and made it a trigger for the multiview, but that doesn't refresh the images.
What code should I put in the button click event to refresh the images in a multiview, or is there another way to do this that is more efficient?
Also, how can I modify the page so when someone returns to the page, it remembers the city they were viewing? General information to this end would be appreciated, is there something I could put in global.asax that might help accomplish this goal?
My code is attached:
1. aspx code
2. code behind
3. a few images from the chattanooga view
The problem is refreshing the images...since the page load event defaults to Nashville, when someone hits the refresh button in their browser, it goes back to Nashville regardless of what city they were viewing. I added a button to the page called "refresh images" and made it a trigger for the multiview, but that doesn't refresh the images.
What code should I put in the button click event to refresh the images in a multiview, or is there another way to do this that is more efficient?
Also, how can I modify the page so when someone returns to the page, it remembers the city they were viewing? General information to this end would be appreciated, is there something I could put in global.asax that might help accomplish this goal?
My code is attached:
1. aspx code
2. code behind
3. a few images from the chattanooga view
<%@ Page Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="allcameras.aspx.vb" Inherits="Default2" title="VECTOR - All Tennessee Traffic Cameras" %>
<%@ Register Src="chattanoogacams.ascx" TagName="chattanoogacams" TagPrefix="uc2" %>
<%@ Register Src="franklincams.ascx" TagName="franklincams" TagPrefix="uc3" %>
<%@ Register Src="nashvillecams.ascx" TagName="nashvillecams" TagPrefix="uc4" %>
<%@ Register Src="memphiscams.ascx" TagName="memphiscams" TagPrefix="uc5" %>
<%@ Register Src="knoxvillecams.ascx" TagName="knoxvillecams" TagPrefix="uc6" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<center>
<table width="750">
<tr>
<td align="left" colspan="3">
<h3>
TDOT - All TN Traffic Cameras</h3>
</td>
<td align="right" colspan="1" rowspan="2">
<img src="images/smartwaylogo.jpg" /></td>
</tr>
<tr>
<td align="left" colspan="2">
Select city:
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
<asp:ListItem>Chattanooga</asp:ListItem>
<asp:ListItem>Knoxville</asp:ListItem>
<asp:ListItem>Memphis</asp:ListItem>
<asp:ListItem Selected="True">Nashville</asp:ListItem>
<asp:ListItem>Franklin</asp:ListItem>
</asp:DropDownList></td>
<td align="left" colspan="1" style="text-align: center">
<asp:Button ID="btnRefresh" runat="server" Text="Refresh Images" /></td>
</tr>
</table>
</center>
<hr />
<center>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<table>
<tr>
<td><img alt="loading image" src="images/progress.gif" />
</td>
<td>
Loading images, please wait...</td>
</tr>
</table>
</ProgressTemplate>
</asp:UpdateProgress>
</center>
<center>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:MultiView ID="MultiView1" runat="server">
<asp:View ID="vwChattanooga" runat="server">
<uc2:chattanoogacams ID="Chattanoogacams1" runat="server" />
</asp:View>
<asp:View ID="vwKnoxville" runat="server">
<uc6:knoxvillecams ID="Knoxvillecams1" runat="server" />
</asp:View>
<asp:View ID="vwMemphis" runat="server">
<uc5:memphiscams ID="Memphiscams1" runat="server" />
</asp:View>
<asp:View ID="vwNashville" runat="server">
<uc4:nashvillecams ID="Nashvillecams1" runat="server" />
</asp:View>
<asp:View ID="vwFranklin" runat="server">
<uc3:franklincams ID="Franklincams1" runat="server" />
</asp:View>
</asp:MultiView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
<asp:AsyncPostBackTrigger ControlID="btnRefresh" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</center>
</asp:Content>
'******code behind follows*******
Partial Class Default2
Inherits System.Web.UI.Page
Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
'when dropdownlist selection changes, make view active for that city
Select Case DropDownList1.SelectedValue
Case "Chattanooga"
MultiView1.ActiveViewIndex = 0
System.Threading.Thread.Sleep(1000)
Case "Knoxville"
MultiView1.ActiveViewIndex = 1
System.Threading.Thread.Sleep(1000)
Case "Memphis"
MultiView1.ActiveViewIndex = 2
System.Threading.Thread.Sleep(1000)
Case "Nashville"
MultiView1.ActiveViewIndex = 3
System.Threading.Thread.Sleep(1000)
Case "Franklin"
MultiView1.ActiveViewIndex = 4
System.Threading.Thread.Sleep(3000)
End Select
End Sub
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
'when page loads, set active view to Nashville
MultiView1.ActiveViewIndex = 3
End Sub
Protected Sub btnRefresh_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnRefresh.Click
'tried to put code here to refresh page...this gets updatepanel to fire, but the images are not refreshing
Select Case DropDownList1.SelectedValue
Case "Chattanooga"
MultiView1.ActiveViewIndex = 0
System.Threading.Thread.Sleep(1000)
Case "Knoxville"
MultiView1.ActiveViewIndex = 1
System.Threading.Thread.Sleep(1000)
Case "Memphis"
MultiView1.ActiveViewIndex = 2
System.Threading.Thread.Sleep(1000)
Case "Nashville"
MultiView1.ActiveViewIndex = 3
System.Threading.Thread.Sleep(1000)
Case "Franklin"
MultiView1.ActiveViewIndex = 4
System.Threading.Thread.Sleep(3000)
End Select
End Sub
End Class
'*****chattanooga view*******
<a href="http://www.tdot.state.tn.us/cctv/cctvchatt/Cam26.asp"><img src="http://www.tdot.state.tn.us/cctv/cctvchatt/live/cam_75-06.jpg" alt="I-75 @ E Brainerd Rd" height="136" width="200" border="0" /></a>
<a href="http://www.tdot.state.tn.us/cctv/cctvchatt/Cam16.asp"><img src="http://www.tdot.state.tn.us/cctv/cctvchatt/live/cam_24-16.jpg" alt="I-24 @ South Crest Rd overpass" height="136" width="200" border="0" /></a>
<a href="http://www.tdot.state.tn.us/cctv/cctvchatt/Cam17.asp"><img src="http://www.tdot.state.tn.us/cctv/cctvchatt/live/cam_24-17.jpg" alt="I-24 @ Germantown Rd" height="136" width="200" border="0" /></a>
<a href="http://www.tdot.state.tn.us/cctv/cctvchatt/Cam18.asp"><img src="http://www.tdot.state.tn.us/cctv/cctvchatt/live/cam_24-18.jpg" alt="I-24 @ S Moore Rd" height="136" width="200" border="0" /></a>
ASKER
Thanks for the comment.
How would I go about adding the random number to the end of the img src tag? There are about 60 cameras in each view...how long would the random number have to be?
In the code, do I need to programmatically change the src tag for each image? Would the code go in the code behind page of the user control or the main page?
I guess the pseudo-code might look something like:
for i = 1 to 60 'iterate through all cameras
'in each image, I assume I need to assign an id number, is that correct?
'img1.src = img1.src & random()
'img2.src = img2.src & random()
next
Thanks
How would I go about adding the random number to the end of the img src tag? There are about 60 cameras in each view...how long would the random number have to be?
In the code, do I need to programmatically change the src tag for each image? Would the code go in the code behind page of the user control or the main page?
I guess the pseudo-code might look something like:
for i = 1 to 60 'iterate through all cameras
'in each image, I assume I need to assign an id number, is that correct?
'img1.src = img1.src & random()
'img2.src = img2.src & random()
next
Thanks
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
vs1784,
That did it!!! I ended up getting it to work on a test page with only one random number (not an array) and appending that to the end of each image's imageurl property. Let me know if there is a problem with doing it that way, it seems to be working great so far.
Attached is my code snippet.
Thanks again!
That did it!!! I ended up getting it to work on a test page with only one random number (not an array) and appending that to the end of each image's imageurl property. Let me know if there is a problem with doing it that way, it seems to be working great so far.
Attached is my code snippet.
Thanks again!
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim jrnd As New Random
Image1.ImageUrl = Image1.ImageUrl & "?" & jrnd.Next(1, 1000).ToString
Image2.ImageUrl = Image2.ImageUrl & "?" & jrnd.Next(1, 1000).ToString
End Sub
ASKER
thanks again for your help, I appreciate it. sorry it took so long for me to get back to you on this. I had a computer crash on me last week.
Best way to do it is add a random number at the end of image name everytime you want to refresh it like below
<img src="http://www.tdot.state.tn.us/cctv/cctvchatt/live/cam_75-06.jpg?423423423542354" alt="I-75 @ E Brainerd Rd" height="136" width="200" border="0" />
Hope it helps
Thanks