ASP.NET CommandField 和皮肤答案

【问题标题】：ASP.NET CommandField & skinASP.NET CommandField 和皮肤
【发布时间】：2010-03-17 17:10:25
【问题描述】：

我正在绑定 ASP.NET GridView CommandField 的皮肤。一切正常，就在我将 CommandField 属性声明从页面移动到皮肤文件时，整个 commandField 属性都被忽略了。这是我的皮肤文件：

<asp:GridView 
AllowPaging="true" 
AllowSorting="false" 
AutoGenerateEditButton="false" 
AutoGenerateDeleteButton="false" 
AutoGenerateSelectButton="false" 
AutoGenerateColumns="false" 
GridLines="None" 
PageSize="20" 
ShowFooter="false" 
ShowHeader="true" 
runat="server"> 
<Columns> 

<asp:CommandField 
ButtonType="Image" 
ControlStyle-Width="25" 
EditImageUrl="Images/Icons/pencil.png" 
DeleteImageUrl="Images/Icons/cross.png" 
/> 

</Columns> 
</asp:GridView>

在 web.config 中，我只应用 StyleSheetTheme。我错过了什么吗？

谢谢

【问题讨论】：

标签： asp.net skin commandfield

【解决方案1】：

这可以通过使用 StyleSheetTheme 和 NOT Theme 来实现。

以下是 .skin 文件中定义的控件样式

<asp:GridView runat="server" Font-Names="verdana,arial,sans serif" AllowSorting="True" AllowPaging="True" AutoGenerateColumns="False" Width="95%">
<Columns>
    <asp:CommandField ButtonType="Image" CancelImageUrl="~/Images/Buttons/16x16/Cancel.gif"
        EditImageUrl="~/Images/Buttons/16x16/Edit.gif" ShowEditButton="True" InsertImageUrl="~/Images/Buttons/16x16/New.gif" UpdateImageUrl="~/Images/Buttons/16x16/Update.gif" />

    <asp:CommandField ButtonType="Image" DeleteImageUrl="~/Images/Buttons/16x16/Delete.gif"
        ShowDeleteButton="True" />
</Columns>

<RowStyle Font-Size="Smaller" ForeColor="Black" />
<PagerStyle Font-Size="Smaller" ForeColor="Black" />
<SelectedRowStyle BackColor="Yellow" />
<HeaderStyle BackColor="#2D5C3D" Font-Size="Smaller" ForeColor="White" HorizontalAlign="left" />
<FooterStyle BackColor="#2D5C3D" />
<EditRowStyle BackColor="#2D5C3D" />
<AlternatingRowStyle BackColor="#ECE9D8" />

web.config 文件将 StyleSheetTheme 定义为站点级别

<pages styleSheetTheme="Green" controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID"/>

包含 GridView 控件的 .aspx 页面

    <asp:GridView ID="gvUser" runat="server" AutoGenerateColumns="False" 
    DataKeyNames="Id" onpageindexchanged="gvUser_PageIndexChanged" 
    onpageindexchanging="gvUser_PageIndexChanging" 
    onrowcancelingedit="gvUser_RowCancelingEdit" onrowdeleting="gvUser_RowDeleting" 
    onrowediting="gvUser_RowEditing" onrowupdating="gvUser_RowUpdating" 
    onselectedindexchanging="gvUser_SelectedIndexChanging" onsorted="gvUser_Sorted" 
    onsorting="gvUser_Sorting">

    <Columns>
        <asp:BoundField DataField="Id" HeaderText="User Id" >
        <HeaderStyle HorizontalAlign="Right" VerticalAlign="Middle" />
        <ItemStyle HorizontalAlign="Right" VerticalAlign="Middle" />
        </asp:BoundField>


    </Columns>
</asp:GridView>

详情请参考以下

希望这会有所帮助！

【讨论】：

【解决方案2】：

我明白了：

文字内容

<asp:CommandField
ButtonType="Image"
ShowDeleteButton="true"
ItemStyle-Width="25"
DeleteImageUrl="~/App_Themes/SimplaAdmin/Images/Icons/cross.png"
/>

不允许在皮肤文件中。

【讨论】：

【解决方案3】：

如果你想使用 Fontawesome 图标，你可以这样改变它：

<asp:CommandField ButtonType="Link" ShowEditButton="true"
EditText="<i class='fas fa-edit'></i>" />

删除使用：

DeleteText="<i class='fas fa-trash-alt'></i>"

卡内尔使用：

CancelText="<i class='fas fa-window-close'></i>"

供更新使用：

UpdateText="<i class='fas fa-sync'></i>"

【讨论】：

【解决方案4】：

如果将 CommandField 标记移到 GridView 标记之外会发生什么？

即：

<asp:GridView 
AllowPaging="true" 
AllowSorting="false" 
AutoGenerateEditButton="false" 
AutoGenerateDeleteButton="false" 
AutoGenerateSelectButton="false" 
AutoGenerateColumns="false" 
GridLines="None" 
PageSize="20" 
ShowFooter="false" 
ShowHeader="true" 
runat="server"> 
</asp:GridView> 

<asp:CommandField 
ButtonType="Image" 
ControlStyle-Width="25" 
EditImageUrl="Images/Icons/pencil.png" 
DeleteImageUrl="Images/Icons/cross.png" 
/>

【讨论】：