Highlighting part of table when a hotspot is clicked

[stitch121103]

I'm working on asomething that has an image map with multiple hotspots. When the hotspot is clicked, I need it to highlight a particular row in the table that gives information about the person that was clicked on.

I know how to highlight the row using the BackColor part like I did here:

<asp:Table ID="Table1" runat="server" border="1">
                                    <asp:tablerow BackColor="LightBlue">
                                        <asp:tablecell>
                                        <B>Instructor Name</B>
                                        </asp:tablecell>
                                        <asp:tablecell>
                                        <B>Certification Level</B>
                                        </asp:tablecell>
                                    </asp:tablerow>

But how can I use it in this part of the code??:

protected void instructor_Clicked(object sender, ImageMapEventArgs e)
    {
        switch (e.PostBackValue)
        {
            case "Jardina":
                **Need to highlight Row1 in the table here**
                break;

Any help would be greatly appreciated. Thanks!

[CroCrew]

Hello stitch121103,

Below is an example.

        <asp:ImageMap ID="ImageMap1" runat="server" ImageUrl="Images/MichiganRegions.gif" Height="800px" Width="800px">
            <asp:CircleHotSpot Radius="100" X="200" Y="200" HotSpotMode="PostBack" NavigateUrl="#" PostBackValue="1" AlternateText="Row 1" />
            <asp:CircleHotSpot Radius="100" X="400" Y="400" HotSpotMode="PostBack" NavigateUrl="#" PostBackValue="2" AlternateText="Row 2" />
            <asp:CircleHotSpot Radius="100" X="600" Y="600" HotSpotMode="PostBack" NavigateUrl="#" PostBackValue="3" AlternateText="Row 3" />
        </asp:ImageMap>

        <asp:Table ID="Table1" runat="server" border="1"> 
            <asp:tablerow> 
                <asp:tablecell>Row 1 Cell 1</asp:tablecell> 
                <asp:tablecell>Row 1 Cell 2</asp:tablecell> 
            </asp:tablerow> 
            <asp:tablerow> 
                <asp:tablecell>Row 2 Cell 1</asp:tablecell> 
                <asp:tablecell>Row 2 Cell 2</asp:tablecell> 
            </asp:tablerow> 
            <asp:tablerow> 
                <asp:tablecell>Row 3 Cell 1</asp:tablecell> 
                <asp:tablecell>Row 3 Cell 2</asp:tablecell> 
            </asp:tablerow> 
        </asp:Table>

    Protected Sub ImageMap1_Click(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ImageMapEventArgs) Handles ImageMap1.Click
        Table1.Rows(0).BackColor = Drawing.Color.White
        Table1.Rows(1).BackColor = Drawing.Color.White
        Table1.Rows(2).BackColor = Drawing.Color.White

        Select Case e.PostBackValue
            Case 1
                Table1.Rows(0).BackColor = Drawing.Color.Blue
            Case 2
                Table1.Rows(1).BackColor = Drawing.Color.Blue
            Case 3
                Table1.Rows(2).BackColor = Drawing.Color.Blue
        End Select
    End Sub

Happy Coding,
CroCrew~

[stitch121103]

Ok, So I tried changing my code around a little to match the example you gave so I could make sure I understood how it was working, but I'm getting the following error:

Compiler Error Message: CS1002: ; expected

Source Error:

Line 8: public partial class instructors : System.Web.UI.P age
Line 9: {
Line 10: Protected Sub ImageMap1_Click (ByVal sender As Object, ByVal e As System.Web.UI.W ebControls.Imag eMapEventArgs) Handles ImageMap1.Click
Line 11: Table1.Rows(0). BackColor = Drawing.Color.B lue
Line 12: Table1.Rows(1). BackColor = Drawing.Color.W hite


And here's the code if you need it:

(from instructors.asp x)

<asp:ImageMap ID="ImageMap1"
                    ImageURL="images/instructors.jpg"
                    runat="server" 
                    AlternateText="Image of a group of kayaking instructors"
                    Width="447" Height="266">
                
                <asp:RectangleHotSpot
                    AlternateText="Image of a kayaking instructor- Jardina"
                    Left="20" Top="60" Right="104" Bottom="236"
                    HotSpotMode="PostBack" PostBackValue="1" />
                
                <asp:RectangleHotSpot
                    AlternateText="Image of a kayaking instructor- Cheung"
                    Left="96" Top="17" Right="172" Bottom="169"
                     HotSpotMode="PostBack" PostBackValue="2" />
                    
                <asp:RectangleHotSpot
                    AlternateText="Image of a kayaking instructor - Reimer"
                    Left="172" Top="17" Right="235" Bottom="165"
                    HotSpotMode="PostBack" PostBackValue="3" />
                    
                <asp:RectangleHotSpot
                    AlternateText="Image of a kayaking instructor- Miolla"
                    Left="235" Top="26" Right="297" Bottom="155"
                    HotSpotMode="PostBack" PostBackValue="4" />
                    
                <asp:RectangleHotSpot
                    AlternateText="Image of a kayaking instructor- Lembright"
                    Left="297" Top="23" Right="370" Bottom="158"
                    HotSpotMode="PostBack" PostBackValue="5" />
                    
                <asp:RectangleHotSpot
                    AlternateText="Image of a kayaking instructor- Yaron"
                    Left="370" Top="24" Right="436" Bottom="128"
                    HotSpotMode="PostBack" PostBackValue="6" />
                
                </asp:ImageMap>

<asp:Table ID="Table1" runat="server" border="1">
                                    <asp:tablerow>
                                        <asp:tablecell><B>Instructor Name</B></asp:tablecell>
                                        <asp:tablecell><B>Certification Level</B></asp:tablecell>
                                    </asp:tablerow>
                                    
                                    <asp:tablerow>
                                        <asp:tablecell>Bob Jardina</asp:tablecell>
                                        <asp:tablecell>Swift-Water Rescue Instructor</asp:tablecell>
                                    </asp:tablerow>
                                    
                                    <asp:tablerow>
                                        <asp:tablecell>Lisa Cheung</asp:tablecell>
                                        <asp:tablecell>River Guide Training Instructor</asp:tablecell>
                                    </asp:tablerow>
                                    
                                    <asp:tablerow>
                                        <asp:tablecell>Judy Reimer</asp:tablecell>
                                        <asp:tablecell>Kayak Instructor II</asp:tablecell>
                                    </asp:tablerow>
                                    
                                    <asp:tablerow>
                                        <asp:tablecell>Wendy Miolla</asp:tablecell>
                                        <asp:tablecell>Kayak Instructor I</asp:tablecell>
                                    </asp:tablerow>
                                    
                                    <asp:tablerow>
                                        <asp:tablecell>Jody Lembright</asp:tablecell>
                                        <asp:tablecell>Kayak Instructor II</asp:tablecell>
                                    </asp:tablerow>
                                    
                                    <asp:tablerow>
                                        <asp:tablecell>Dave Yaron</asp:tablecell>
                                        <asp:tablecell>River Guide Training Instructor</asp:tablecell>
                                    </asp:tablerow>
                                    
                                </asp:Table>

(this is from instructors.asp x.cs)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class instructors : System.Web.UI.Page
{
    Protected Sub ImageMap1_Click(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ImageMapEventArgs) Handles ImageMap1.Click
        Table1.Rows(0).BackColor = Drawing.Color.Blue
        Table1.Rows(1).BackColor = Drawing.Color.White
        Table1.Rows(2).BackColor = Drawing.Color.White
        Table1.Rows(3).BackColor = Drawing.Color.White
        Table1.Rows(4).BackColor = Drawing.Color.White
        Table1.Rows(5).BackColor = Drawing.Color.White
        Table1.Rows(6).BackColor = Drawing.Color.White

        Select Case e.PostBackValue
            Case 1
                Table1.Rows(1).BackColor = Drawing.Color.Yellow
            Case 2
                Table1.Rows(2).BackColor = Drawing.Color.Yellow
            Case 3
                Table1.Rows(3).BackColor = Drawing.Color.Yellow    
            Case 4
                Table1.Rows(4).BackColor = Drawing.Color.Yellow
            Case 5
                Table1.Rows(5).BackColor = Drawing.Color.Yellow
            Case 6
                Table1.Rows(6).BackColor = Drawing.Color.Yellow
        End Select
    End Sub
}

Do you know what's causing that error? Am I putting something in the wrong place?...if so, where should it be. Sorry if I sound so lost.... haven't really done much with ASP.

[CroCrew]

Try this:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls;

public partial class instructors : System.Web.UI.Page 
{ 
    protected void  ImageMap1_Click1(object sender, ImageMapEventArgs e)
    {
        Table1.Rows[0].BackColor = System.Drawing.Color.Blue;
        Table1.Rows[1].BackColor = System.Drawing.Color.Blue;
        Table1.Rows[2].BackColor = System.Drawing.Color.Blue;
        Table1.Rows[3].BackColor = System.Drawing.Color.Blue;
        Table1.Rows[4].BackColor = System.Drawing.Color.Blue;
        Table1.Rows[5].BackColor = System.Drawing.Color.Blue;
        Table1.Rows[6].BackColor = System.Drawing.Color.Blue;
  
        switch(e.PostBackValue)
        {
            case "1":
                Table1.Rows[0].BackColor = System.Drawing.Color.Yellow;
                break;
            case "2":
                Table1.Rows[1].BackColor = System.Drawing.Color.Yellow;
                break;
            case "3":
                Table1.Rows[2].BackColor = System.Drawing.Color.Yellow;
                break;
            case "4":
                Table1.Rows[3].BackColor = System.Drawing.Color.Yellow;
                break;
            case "5":
                Table1.Rows[4].BackColor = System.Drawing.Color.Yellow;
                break;
            case "6":
                Table1.Rows[5].BackColor = System.Drawing.Color.Yellow;
                break;
            case "7":
                Table1.Rows[6].BackColor = System.Drawing.Color.Yellow;
                break;
        }
    }
}

Happy Coding,
CroCrew~

[Frinavale]

Just so you know, every line in C# must be terminated with a ";"
:)

-Frinny