Question

这让我开心！这是我用Datagrid完成了100多次的事情。我现在正在使用Gridview，我无法解决这个问题。

我有这个网格：

<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>

在RowDataBound期间，我尝试过：

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

它永远不会将行设置为背景颜色..我已成功使用：

gridrow.Cells(0).BackColor = Drawing.Color.Blue

但整个行呢？不！它让我疯了..任何人都有解决方案吗？

为了好玩，我把它放在SAME页面上：

<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>

在ItemDataBound中我放了：

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

它按预期工作。那么我对Gridview做错了什么？

**更新************************

我以为我会发布生成的HTML，以显示任何样式都不会影响这一点。

这是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>

这是生成的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>

参见..主要区别在于标签。它永远不会在gridview中设置..我不知道为什么..我已经通过它进行了跟踪..代码运行了..：S

Answer 1

我这样做了：

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

并在example.css中：

.rowstyle
{
    background-color:#e5e5e5;
}

Answer 2

这实际上应该在RowCreatedEvent期间完成。刚刚测试了以下代码，它非常有效地突出显示/取消突出显示鼠标悬停时的行。

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

编辑：追加html输出（注意：在VB和C＃中使用RowCreated - 相同的输出）

<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>

编辑：这是我得到的HTML方面。我保持简单。在你的HTML方面你可能有一个干扰的css配置。

<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>

Answer 3

IE6中出现此问题。我通过设置gridview行中所有单元格的CssClass名称来解决它。这是代码：

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;
   }
}

Answer 4

您是否在为GridView使用CSSFriendly控制适配器？它们可能无法呈现您添加的属性。

ASP.NET GridView - 在数据绑定期间无法设置行的颜色？

4 个答案: