Pergunta

Estou amarrando a pele asp.net gridview Commandfield. Tudo funcionando bem, exatamente quando eu movo as declarações de propriedade do Commandfield de Page para Skin File, todas as propriedades do Commandfield são ignoradas. Aqui está o meu arquivo de pele:

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

No web.config, aplico apenas StylesheetTheMe. Eu sinto falta de alguma coisa?

Obrigado

Foi útil?

Solução

Isso pode ser alcançado usando o StylesheetTheme e não o tema.

A seguir, o estilo de controle definido em um arquivo .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" />

O arquivo web.config define o nível StylesheetTheme como nível de site

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

A página .aspx que contém o controle Gridview

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

Para detalhes, consulte o seguinte

  1. http://weblogs.asp.net/vimodi/themesfaqs
  2. http://weblogs.asp.net/vimodi/whatis-stylesheettheme

Espero que isto ajude!

Outras dicas

Eu recebo:

Conteúdo de literal

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

não é permitido dentro de um arquivo de pele.

Se você quiser usar um Fontawesome Ícone, você pode mudar assim:

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

Para excluir uso:

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

Para uso do Canel:

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

Para uso da atualização:

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

O que acontece se você mover a etiqueta de comando para fora da tag Gridview?

ou seja:

<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" 
/> 
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top