Unable to highlight grid cells in Chrome and Safari

We are excited to announce that the ASP.NET Forums are moving to the new Microsoft Q&A experience. Learn more >

View Complete Thread

Shortcuts

Related Links

Yang Shen

Contributor

3140 Points

983 Posts

Re: Unable to highlight grid cells in Chrome and Safari

Nov 20, 2019 02:30 AM|Yang Shen|LINK

Hi wrappingduke,

I built a demo based on your code which is .Net Framework 3.5 as you said.

However it seems works well in Chrome. Doese this " works intermittently in Chrome and Safari" mean that you met this problem in Chrome randomly?

Maybe you could provide your aspx code, it might help us reproduce the problem.

Below is the current demo:

ASPX:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="grdSchedule" runat="server" OnRowCommand="grdSchedule_RowCommand" AutoGenerateColumns="false" OnRowDataBound="grdSchedule_RowDataBound">
                <Columns>
                    <asp:TemplateField>
                        <HeaderTemplate>ID</HeaderTemplate>
                        <ItemTemplate>
                            <asp:LinkButton ID="LinkButton1" runat="server" CommandArgument="0"><%#Eval("ID") %></asp:LinkButton>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>FirstName</HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label1" runat="server" CommandArgument="1" Text='<%#Eval("FirstName") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>LastName</HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label2" runat="server" CommandArgument="2" Text='<%#Eval("LastName") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>Phone1</HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label3" runat="server" CommandArgument="3" Text='<%#Eval("Phone1") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <HeaderTemplate>username</HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="Label4" runat="server" CommandArgument="5" Text='<%#Eval("username") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
        </div>
    </form>
</body>
</html>

VB:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            BindData()
        End If
    End Sub

    Protected Sub BindData()
        Dim dt As DataTable = New DataTable()
        dt.Columns.AddRange(New DataColumn(4) {New DataColumn("FirstName"), New DataColumn("LastName"), New DataColumn("ID"), New DataColumn("Phone1"), New DataColumn("username")})
        dt.Rows.Add("AA", "aa", "1", "000", "Aa")
        dt.Rows.Add("BB", "bb", "2", "000", "Bb")
        dt.Rows.Add("CC", "cc", "3", "000", "Cc")
        dt.Rows.Add("DD", "dd", "4", "000", "Dd")
        dt.Rows.Add("EE", "ee", "5", "000", "Ee")
        dt.Rows.Add("FF", "ff", "6", "000", "Ff")
        dt.Rows.Add("GG", "gg", "7", "000", "Gg")
        grdSchedule.DataSource = dt
        grdSchedule.DataBind()
    End Sub

    Protected Sub grdSchedule_RowCommand(sender As Object, e As GridViewCommandEventArgs)
        Dim m_RowIndex As Int32
        Dim miColumnClicked As Int32
        Dim m_PrevBgColor As Color
        'set previously selected cell's background to default color 
        grdSchedule.Rows(m_RowIndex).Cells(miColumnClicked).BackColor = m_PrevBgColor 'Drawing.Color.White
        'set module-level variables
        m_RowIndex = Integer.Parse(e.CommandArgument.ToString())
        miColumnClicked = Integer.Parse(Request.Form("__EVENTARGUMENT"))

        'retain bg color prior to change or highlight 
        m_PrevBgColor = grdSchedule.Rows(m_RowIndex).Cells(miColumnClicked).BackColor
        'retain highlight of selected cell 
        grdSchedule.Rows(m_RowIndex).Cells(miColumnClicked).BackColor = System.Drawing.SystemColors.Highlight
    End Sub

    Protected Sub grdSchedule_RowDataBound(sender As Object, e As GridViewRowEventArgs)
        'Dim itemType As ListItemType = e.Item.ItemType
        Dim itemType As DataControlRowType = e.Row.RowType
        Dim button As LinkButton
        Dim strPostBack As String
        Dim sJavaScriptArg As String

        If e.Row.RowType = ListItemType.Item Then
            'get the link button control in the first cell
            button = CType(e.Row.Cells(0).Controls(1), LinkButton)
            strPostBack = Me.Page.ClientScript.GetPostBackClientHyperlink(button, "")

            For i = 0 To e.Row.Cells.Count - 1
                'add the column index as the event argument parameter
                sJavaScriptArg = strPostBack.Insert(strPostBack.Length - 2, i.ToString)
                'add this javascript to the onclick Attribute of the cell
                e.Row.Cells(i).Attributes("onclick") = sJavaScriptArg
            Next
        End If
    End Sub

Best Regard,

Yang Shen