Question

我在DataGrid中有一个ButtonColumn：

<asp:ButtonColumn HeaderText="Edit" ButtonType="PushButton" Text="Edit" />

如何设置它的CSS类？

我能看到的唯一方法就是挂钩RowDataBound事件：

Protected Sub dgSchedule_ItemDataBound(sender As Object, e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles dgSchedule.ItemDataBound
    If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then
        DirectCast(e.Item.Cells(6).Controls(0), Button).CssClass = "confirmButton"

    End If
End Sub

我觉得必须有一个更简洁的方式。如果我添加/删除列会发生什么，我将不得不回到这里并记得更改第6列......

我尝试使用TemplateColumn和通常的asp:Button - 这有效，但是点击它并没有触发我需要触发的网格的ItemCommand事件。

Answer 1

我已经通过使用GridView而不是DataGrid解决了这个问题。实际上我不确定为什么我首先使用了DataGrid。

这会提供额外的属性ControlStyle-CssClass

e.g。

<asp:ButtonField HeaderText="Edit" ButtonType="Button" Text="Edit" ControlStyle-CssClass="confirmButton" />

Answer 2

你有两个选择：

<强> 1。您可以设置ButtonColumn的CssClass属性：

<asp:ButtonColumn CssClass="myStyle" ...></asp:ButtonColumn>

这将呈现以下HTML：

<td class="myStyle">
    <input type=button name=select ...>
</td>

如您所见，CSS类实际上应用于包含元素。要设置列的样式，请执行以下操作：

.myClass
{
   /*Your style attributes go here*/
}

要设置实际按钮的样式，请在CSS中执行此操作：

.myClass INPUT
{
   /*Your style attributes go here*/
}

<强> 2。或者，您可以使用TemplateColumn而不是ButtonColumn并设置嵌套按钮控件的CssClass属性：

<asp:TemplateColumn HeaderText="Delete">
    <ItemTemplate>
        <asp:Button ID="DeleteButton" runat=server Text="Delete" CssClass="myClass" CommandName="Delete" />
    </ItemTemplate>
</asp:TemplateColumn>

这方面的CSS正如您所期望的那样：

.myClass
{
   /*Your style attributes go here*/
}

Answer 3

如果您需要坚持使用DataGrid而不是使用GridView，解决此问题的一种方法是设置OnItemDataBound事件。

OnItemDataBound="mydatagrid_ItemDataBound"

然后在后面的代码中，您可以将CSS类附加到按钮，如下所示：

//ON DATA BIND
protected void mydatagrid_ItemDataBound(object sender, DataGridItemEventArgs e)
    if (e.Item.ItemType != ListItemType.Header && e.Item.ItemType != ListItemType.Footer) {
        Button myButton= (Button)e.Item.Cells[5].Controls[0];
        myButton.Attributes["class"] = "buttonClass";   
    }
}

如何在DataGrid中的按钮上设置CssClass

3 个答案: