Güzel görünümlü, resimlerle kullanmak için checkbox ihtiyacınız var

Uygulamanızda bazen güzel görünümlü, hatta resim olarak değişen, checkbox kontrollerine ihtiyaç duyarsınız. Bu durumda aşağıdaki adımları takip etmek gerekiyor.
Öncelikle sayfanıza bir scriptmanager ve updatepanel'ler eklemeniz gerekiyor. scriptmanager kullanacağımız Updatepanel'ler için konulması zorunlu bir kontrol.
Updatepanel içine de checkbox görünümlü imagebutton kontrolleri kullanacağız.
Bir de seçilen değerleri tutmak hiddenfield

Kod kısmı ise şu şekilde görünüyor olacak (HTML)

<asp:HiddenField ID="hfSecilenDeger" runat="server" /><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
   <asp:PostBackTrigger ControlID="imgBut1T" />
</Triggers>
<ContentTemplate>

<asp:ImageButton ID="imgBut1T" runat="server" Width="30px" OnPreRender="addTrigger_PreRender"
ImageUrl="~/images/checkBos.gif" OnClick="imgBut1T_Click" />
</ContentTemplate>
</asp:UpdatePanel>

Ne kadar checkbox ihtiyacınız varsa bu kod bloğunu çoğaltıyorsunuz fakat script manager'dan bir tanesi tüm sayfanızdaki update panellere yetiyor olacak unutmayın.
Yani aşağıdaki gibi
 
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<Triggers>
  <asp:PostBackTrigger ControlID="imgBut2T" />
</Triggers>
<ContentTemplate>
<asp:ImageButton ID="imgBut2T" runat="server" Width="30px" OnPreRender="addTrigger_PreRender"
ImageUrl="~/images/checkBos.gif" OnClick="imgBut2T_Click" />

</ContentTemplate>
</asp:UpdatePanel>

Bu yazdığımız kodu .cs sayfasında bir de ScripManager'a register etmemiz gerekiyor
protected void addTrigger_PreRender(object sender, EventArgs e)
{if (sender is ImageButton)
{
ImageButton MyButton = (ImageButton)sender;
ScriptManager NewScriptManager = (ScriptManager)this.FindControl("ScriptManager1");

NewScriptManager.RegisterPostBackControl(MyButton);this.ScriptManager1.RegisterPostBackControl(MyButton);

           }

}

Son yapılacak şey ise imagebutton'ların click eventlerini yakalamak

protected void imgBut1T_Click(object sender, ImageClickEventArgs e)
{
if (imgBut1T.ImageUrl == "~/images/checkDolu.gif")
   imgBut1T.ImageUrl = "~/images/checkBos.gif";
else
   imgBut100T.ImageUrl = "~/images/checkDolu.gif";

imgBut2T.ImageUrl = "~/images/checkBos.gif"; //Diğer butonun görünümünü de burada etkileyebilirsiniz, eğer her ikisinin aynı anda seçilmesini istemiyorsanız.
hfSecilenDeger.Value = "vidividi";

}