So, I’ve been struggling for a while with how to style a checkbox to work with a skin file. Basically, what I did was create some gif files that look like checked and unchecked check boxes. I defined them in my SkinFile.skin file as follows:
<asp:ImageButton SkinID=”iconCheckedDisabled” ImageUrl=”Images/iconCheckedDisabled.gif” runat=”server” ToolTip=”Checked Disabled” />
<asp:ImageButton SkinID=”iconCheckedEnabled” ImageUrl=”Images/iconCheckedEnabled.gif” runat=”server” ToolTip=”Checked Enabled” />
<asp:ImageButton SkinID=”iconUnCheckedDisabled” ImageUrl=”Images/iconUnCheckedDisabled.gif” runat=”server” ToolTip=”Unchecked Disabled” />
<asp:ImageButton SkinID=”iconUnCheckedEnabled” ImageUrl=”Images/iconUnCheckedEnabled.gif” runat=”server” ToolTip=”Unchecked Enabled” />
The image files look like the following:
The problem basically is that you can’t dynamically swap skin files easily because they must be set at the preinit phase of event processing. Not at databound events which is where I’d want to do it.
So, my revelation was that I could just list all the states in a gridview template, then use the visibility attribute to make them show the correct one. That way, the skins are all loaded all the time, just now showing all the time. The GridView Code looks like the following:
<asp:GridView ID=”GridViewAssigned” runat=”server” AllowPaging=”True”
AllowSorting=”True” Caption=”Assigned” AutoGenerateColumns=”false”
DataSourceID=”ObjectDataSourceGroupsAssigned”
>
<Columns>
<asp:TemplateField ShowHeader=”False” >
<ItemTemplate>
<asp:ImageButton ID=”LinkButtonUnassign” SkinID=”ImageButtonRemove” runat=”server” BackColor=”white” CausesValidation=”False”
CommandArgument=’<%# Eval(“id”) %>‘ CommandName=”Select” ForeColor=”black” />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ShowHeader=”True” HeaderText=”Assign To New Content By Default” >
<ItemTemplate>
<asp:ImageButton ID=”LinkButtonToggleDefaultChecked” SkinID=’iconCheckedEnabled’ runat=”server” BackColor=”white” CausesValidation=”False”
visible=’<%# (bool) Eval(“Defaultnewcontent”) %>‘
CommandArgument=’<%# Eval(“id”) + “;” + Eval(“Approved”) %>‘ CommandName=”ToggleDefault” ForeColor=”black” />
<asp:ImageButton ID=”LinkButtonToggleDefaultUnChecked” SkinID=”iconUnCheckedEnabled” runat=”server” BackColor=”white” CausesValidation=”False”
visible=’<%# !(bool) Eval(“Approved”) %>‘
CommandArgument=’<%# Eval(“id”) + “;” + Eval(“Approved”) %>‘ CommandName=”ToggleDefault” ForeColor=”black” />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField=”Name” HeaderText=”Name” SortExpression=”Name” />
</Columns>
</asp:GridView>
Then, when you finally run it, the gridview looks something like this.
Notice no codebehind was necessary for this trick! Good luck and hope this save you some time.












November 25th, 2007 at 8:37 pm
greate
January 5th, 2008 at 4:28 pm
thanks alot! you saved my day
June 17th, 2008 at 8:58 am
Brilliant…
Made use of this but used static images instead, since my checkbox is read only.
Thanks so much
July 18th, 2008 at 8:16 am
ooh wow, check boxes
January 21st, 2009 at 11:21 am
Thank you.
January 28th, 2009 at 11:19 am
Can you please post the whole code (including sql connections)? because I don’t know for sure what I must change…
thanks!
August 13th, 2009 at 11:32 am
I have an issue using if statement in check box gridview
Here is my code:
<%# String.Compare((string)Eval(“request”),”1″,fa lse)==0?”":”
It doesn’t show the checkbox, display nothing…. any suggestion. Thanks…
January 24th, 2010 at 2:37 am
mmm