This is driving me NUTS! It's something that I've done 100s of time with a Datagrid. I'm now using a Gridview and I can't figure this out.
I've got this grid:
<asp:GridView AutoGenerateColumns="false" runat="server" ID="gvSelect" CssClass="GridViewStyle"
GridLines="None" ShowHeader="False" PageSize="20" AllowPaging="True">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:Label runat="server" ID="lbldas" Text="blahblah"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
And during the RowDataBound I've tried:
Protected Sub gvSelect_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvSelect.RowCreated
If e.Row.RowType = DataControlRowType.DataRow Then
e.Row.Attributes.Add("onMouseOver", "this.style.backgroundColor='lightgrey'")
End If
End Sub
And it NEVER sets the row backcolor.. I've been successful in using:
gridrow.Cells(0).BackColor = Drawing.Color.Blue
But doing the entire row? NOPE! and it's driving me nuts.. does ANYONE have solution for me?
And just for fun I put this on the SAME page:
<asp:DataGrid AutoGenerateColumns="false" runat="server" ID="dgSelect" GridLines="None"
ShowHeader="False" PageSize="20" AllowPaging="True">
<Columns>
<asp:TemplateColumn>
<ItemTemplate>
<asp:Label runat="server" ID="lbldas" Text="blahblah"></asp:Label>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
And in the ItemDataBound I put:
If Not e.Item.ItemType = ListItemType.Header And Not e.Item.ItemType = ListItemType.Footer Then
e.Item.Attributes.Add("onMouseOver", "this.style.backgroundColor='lightgrey'")
End If
And it works as expected.. SO What am I doing wrong with the Gridview?
**UPDATE ************************
I thought I'd post the resulting HTML to show that any styles aren't affecting this.
Here's the gridview html:
<div class="AspNet-GridView" id="gvSelect">
<table cellpadding="0" cellspacing="0" summary="">
<tbody>
<tr>
<td>
<span id="gvSelect_ctl02_lbldas">blahblah</span>
</td>
</tr>
</tbody>开发者_开发问答;
</table>
</div>
And here's the resulting Datagrid HTML:
<table cellspacing="0" border="0" id="dgSelect" style="border-collapse:collapse;">
<tr onMouseOver="this.style.backgroundColor='lightgrey'">
<td>
<span id="dgSelect_ctl03_lbldas">blahblah</span>
</td>
</tr>
</table>
See.. the main difference is the tag. It never gets set in the gridview.. and I don't know why.. I've traced through it.. and the code gets run.. :S
This should actually be done during the RowCreatedEvent. Just tested the following code and it worked marvelously to highlight/unhighlight a row on mouseover.
Private Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowCreated
If e.Row.RowType = DataControlRowType.DataRow Then
e.Row.Attributes.Add("onmouseover", "this.style.backgroundColor='#ccaaaa';")
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor='#ffffff';")
End If
End Sub
EDIT: Appending html output (NOTE: Works in both VB and C# with RowCreated - same output)
<div>
<table cellspacing="0" rules="all" border="1" id="GridView1" style="border-collapse:collapse;">
<tr>
<th scope="col">ST_CD</th><th scope="col">ST_CD_ALPHA</th><th scope="col">ST_DESC</th>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>04</td><td>CA</td><td>CALIFORNIA </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>34</td><td>OH</td><td>OHIO </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>41</td><td>TN</td><td>TENNESSEE </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>42</td><td>TX</td><td>TEXAS </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>45</td><td>VA</td><td>VIRGINIA </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>46</td><td>WA</td><td>WASHINGTON </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>49</td><td>WY</td><td>WYOMING </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>14</td><td>IA</td><td>IOWA </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>24</td><td>MO</td><td>MISSOURI </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>40</td><td>SD</td><td>SOUTH DAKOTA </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>43</td><td>UT</td><td>UTAH </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>44</td><td>VT</td><td>VERMONT </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>47</td><td>WV</td><td>WEST VIRGINIA </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>48</td><td>WI</td><td>WISCONSIN </td>
</tr><tr onmouseover="this.style.backgroundColor='#ccaaaa';" onmouseout="this.style.backgroundColor='#ffffff';">
<td>54</td><td>AK</td><td>ALASKA </td>
</tr>
</table>
</div>
EDIT: Here is the HTML side that I've got. I kept it simple. It's possible in your HTML side you have a css configuration that is interfering.
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataSourceID="SqlDataSource1">
<Columns>
<asp:BoundField DataField="ST_CD" HeaderText="ST_CD" SortExpression="ST_CD" />
<asp:BoundField DataField="ST_CD_ALPHA" HeaderText="ST_CD_ALPHA"
SortExpression="ST_CD_ALPHA" />
<asp:BoundField DataField="ST_DESC" HeaderText="ST_DESC"
SortExpression="ST_DESC" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:WebTestConnectionString %>"
SelectCommand="SELECT [ST_CD], [ST_CD_ALPHA], [ST_DESC] FROM [STATE_VALUES] WHERE ([ST_CD] LIKE '%' + @ST_CD + '%')">
<SelectParameters>
<asp:Parameter DefaultValue="4" Name="ST_CD" Type="String" />
</SelectParameters>
</asp:SqlDataSource>
</div>
I've done it this way:
Protected Sub gvwCompounds_RowDataBound(ByVal sender As Object, ByVal e As GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.DataRow Then
e.Row.CssClass = "rowstyle"
End If
End Sub
and in example.css:
.rowstyle
{
background-color:#e5e5e5;
}
Are you using CSSFriendly Control Adapters for your GridViews? They may not be rendering the attributes you add.
This problem occurs in IE6. I solved it with setting CssClass names of all cells in the gridview row. Here is the code:
private void grdvw_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onmouseover", "rowHighlight(this,'lightOn');");
e.Row.Attributes.Add("onmouseout", "rowHighlight(this,'');");
}
}
function rowHighlight(obj, nameOfTheClass)
{
cells = obj.getElementsByTagName("td");
for (var i = 0; i < cells.length; i++)
{
cells[i].className = nameOfTheClass;
}
}
精彩评论