Geeks With Blogs

News
AngelEyes on .Net Tips, tricks and WTFs about Asp .Net, SQL Server and the likes.
I wanted to display Boolean data in a Gridview and didn't like that disabled checkbox look. After searching online, I found some people solved this with Javascript, including the MS AJAX extentions toolkit which has an extender - but I didn't want to have a lot of checkboxes in my html that got replaced on the client's side with javascript that had to loop over them all. I just wanted the images.

The quick-and-dirty way to solve this would have been to create a template column for my Gridview with an image control in it and override the Grid's data binding method to set the ImageUrl property.

But that would have to be done everytime, for every Gridview I'd want to use.

So I wrote a simple custom control, inheriting from BoundField (System.Web.UI.WebControls.BoundField) and now I can use it in any website, in any Gridview.

I liked it - hope you do too.

using System;
using System.Data;

using System.Configuration;

using System.Web;

using System.ComponentModel;

using System.Web.UI;

using System.Web.UI.WebControls;

 

namespace CustomBoundField

{
    ///<summary>

    /// Summary description for BoundCheckImageField

    ///</summary>
    public class BoundCheckImageField : System.Web.UI.WebControls.BoundField
    {
        #region Properties
 

        ///<summary>

        /// Gets or sets the url of the image to display for a 'true' value

        ///</summary>

        [DefaultValue("")]

        public string TrueValueImageUrl

        {

            get

            {

                object val = base.ViewState["TrueValueImageUrl"];

                if (val != null)

                {

                    return (string)val;

                }

                return string.Empty;

            }

            set

            {

                if (!object.Equals(value, base.ViewState["TrueValueImageUrl"]))

                {
                    base.ViewState["TrueValueImageUrl"] = value;
                    this.OnFieldChanged();
                }

            }

        }

 

        ///<summary>

        /// Gets or sets the url of the image to display for a 'false' value

        ///</summary>

        [DefaultValue("")]

        public string FalseValueImageUrl

        {

            get

            {

                object val = base.ViewState["FalseValueImageUrl"];

                if (val != null)

                {

                    return (string)val;

                }

                return string.Empty;

            }

            set

            {

                if (!object.Equals(value, base.ViewState["FalseValueImageUrl"]))

                {
                    base.ViewState["FalseValueImageUrl"] = value;
                    this.OnFieldChanged();
                }

            }

        }

 
        #endregion
 

        protected override void InitializeDataCell(DataControlFieldCell cell, DataControlRowState rowState)

        {

            //base.InitializeDataCell(cell, rowState);

 

            if (!string.IsNullOrEmpty(this.DataField))

            {

                Image img = new Image();

                img.DataBinding += new EventHandler(this.OnImageDataBind);
                cell.Controls.Add(img);

            }

        }

 

        protected void OnImageDataBind(object sender, EventArgs e)

        {

       

            Control control = (Control)sender;

            Control namingContainer = control.NamingContainer;

            object dataValue = this.GetValue(namingContainer);

 

            if (control is Image)

            {

                if ((Boolean)dataValue)

                {

                    (control as Image).ImageUrl = this.TrueValueImageUrl;

                }
                else
                {

                    (control as Image).ImageUrl = this.FalseValueImageUrl;

                }

            }

            else

            {

                base.OnDataBindField(sender, e);

            }

        }

    }
}
Posted on Wednesday, July 1, 2009 11:34 AM | Back to top


Comments on this post: A simple custom control, inheriting from BoundField

# re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
Nice post,

um this is much better than using java script and having an unreadable code

Thanks for writing, most people don't bother.
Left by web development company on Aug 27, 2009 7:28 PM

# re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
Thanks for the reply, even the link makes it a little spammed.
Left by Angel Eyes on Aug 28, 2009 8:41 AM

# to: emlak ilanları
Requesting Gravatar...
Sure thing, Elmak.
Left by Angel Eyes on Apr 26, 2010 1:29 PM

# Re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
I am about to start a course on programming and web design...so I will keep this post which seems useful.
thanks
Left by giorgia on Oct 15, 2010 5:31 PM

# to: giorgia
Requesting Gravatar...
Glad it helps
Left by Angel Eyes on Oct 16, 2010 9:20 PM

# re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
Hi, Its really a nice example. Thank you very much
Left by Trxbox on Dec 11, 2010 7:55 PM

# re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
Needed exactly what you did here, thanks for saving me the time for typing it myself!
Left by Niels on Mar 22, 2011 5:44 PM

# re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
@Niels: Thanks for letting me know, you're quite welcome.
Left by AngelEyes on Mar 22, 2011 5:56 PM

# re: A simple custom control, inheriting from BoundField
Requesting Gravatar...
Pretty section! It feels great reading such post like this, very informative and interesting. I've learned. Here's another source that worth a look about this also. Thanks for sharing this info!
Left by Web Design Qatar on Aug 03, 2011 1:10 PM

Your comment:
 (will show your gravatar)


Copyright © AngelEyes | Powered by: GeeksWithBlogs.net