C# 如何为DetailsView的“插入”和“取消”按钮指定不同的样式？

我在插入模式下有一个详细视图：

<asp:CommandField ShowInsertButton="True" ButtonType="Button" ControlStyle-CssClass="myButton" InsertText="My Insert text" />

当然，插入/取消两个按钮的样式相同

是否可以将这两种颜色分别设置为一种蓝色和一种黄色？

在FormView中，可以单独定义按钮，如下所示：

<asp:Button CommandName="Insert" Text="Insert" class="myButtonStyle1"  ID="myButtonID1" runat="server" CausesValidation="True" />

<asp:Button CommandName="Cancel" Text="Cancel" class="myButtonStyle2"  ID="myButtonID2" runat="server" CausesValidation="False" />

DetailsView有类似的功能吗？

使用jQuery(http://docs.jquery.com/Downloading_jQuery#Download_jQuery):

$（函数（）{
变量列表=$（“输入[类型=按钮]”）；
列表。每个函数（itemIndex）{
如果（$（this.val（）=“取消”）
{$（this.addClass（“取消”）；}
否则{
if（$（this.val（）=“插入”）
{$（this.addClass（“插入”）；}
}
});
});

只需在CSS文件中添加两个类（“插入”和“取消”）。 例如

 <style type="text/css">
.Insert {background-color:Red;}
    .Cancel {background-color:Black;}
</style>

.插入{背景色：红色；}
.Cancel{背景色：黑色；}

多亏了kapil khandelwal，这是一个使用jQuery的解决方案，在Zachary提供新的答案之前一直在使用：

<script type="text/javascript" src="../Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
        $(document).ready(function () {
            $("input").each(function () {
                if ($(this).attr("type") == "submit") {
                    if ($(this).val() == "Insert") { $(this).addClass("Insert"); };
                };
                if ($(this).attr("type") == "button") {
                    if ($(this).val() == "Cancel") { $(this).addClass("Cancel"); };
                };
            });
        });
    </script>

$（文档）.ready（函数（）{
$（“输入”）。每个（函数（）{
if（$（this.attr（“type”）=“submit”）{
if（$（this.val（）=“Insert”）{$（this.addClass（“Insert”）；}；
};
if（$（this.attr（“type”）=“button”）{
if（$（this.val（）=“Cancel”）{$（this.addClass（“Cancel”）；}；
};
});
});

最简单的解决方案是将“新建、插入、取消”命令字段转换为TemplateField。如果您使用所见即所得编辑器，则在“确定”按钮上方有一个用于此操作的按钮。这将生成以下（经过审查的）代码，您可以轻松地使用这些代码

        <asp:TemplateField ShowHeader="False">
            <InsertItemTemplate>
                <asp:Button ID="LinkButton1" runat="server" CssClass="insertButton" CausesValidation="True" CommandName="Insert" Text="Insert" />
                &nbsp;<asp:Button ID="LinkButton2" runat="server" CssClass="cancelButton" CausesValidation="False" CommandName="Cancel" Text="Cancel" />
            </InsertItemTemplate>
        </asp:TemplateField>

注意：我在下面的按钮中添加了CssClass属性，CSS类名为“insertButton，cancelButton”，所有这些都可以在样式表中配置

更多说明：

当需要按钮（不是链接按钮）时，不要使用结束标记 （

）-将其替换为内联

/

标记。否则，它将不起作用

使用“仅插入”模式时，不显示“已删除项模板” 需要-删除它

避免使用ControlStyle控件，否则可能会导致类否决

---

你能发布detailsview呈现的html吗。你可以使用Javascript设置按钮的样式。好吧，如果我能给它们起我自己的名字，我可以通过C#代码隐藏来访问它们，对吗？以下是相关的HTML:

卡皮尔·坎德尔瓦尔-我应该把它放在哪里？我应该用我的类名（每个按钮有几个类名）替换addClass中的“插入”吗？@Different111222只需在CSS文件中添加两个类（“插入”和“取消”）。例如，

.Insert{background color:：red；}.Cancel{background color:：black；}

将javascript代码放在.aspx页面上Kapil Khandelwal-我将代码放在头部，然后放在正文内容占位符中（不同时），将Insert和Cancel类添加到css中，但没有任何效果。。。我应该将jQuery函数（以前从未使用过jQuery）放在哪里？我不能使用我使用的按钮的常规样式（“myButton myButtonStyle1”）？@Differentit111222您在页面上添加了jQuery库的引用了吗。如果不是从这里下载：&在jQuery函数上方添加引用。我已经更新了相同的答案。@Different111222我刚刚错过了一个结束括号。我已经修好了。干得好，谢谢。我已经更新了您的解决方案，使之与我实际使用的解决方案相匹配。请参见尾注。

        <asp:TemplateField ShowHeader="False">
            <InsertItemTemplate>
                <asp:Button ID="LinkButton1" runat="server" CssClass="insertButton" CausesValidation="True" CommandName="Insert" Text="Insert" />
                &nbsp;<asp:Button ID="LinkButton2" runat="server" CssClass="cancelButton" CausesValidation="False" CommandName="Cancel" Text="Cancel" />
            </InsertItemTemplate>
        </asp:TemplateField>