Showing a graphical checkmark on DataGrid’s boolean columns

Showing a graphical checkmark on DataGrid’s boolean columns

While working with template-based controls such as the Repeater, DataList or DataGrid, it often happens that you don’t want to show just plain text as it is retrieved from the data source, but want to interpret the data and represent it in other ways. For example, you may want to show a graphical checkmark to indicate whether a boolean field of the data source has a true or false value. You can render this simply with a disabled checkbox (so that it’s read-only) and by binding its Checked property to the boolean data field. Here’s an example with a template column for a DataGrid:

                                        '<%# Container.DataItem("State") = "CA" %>'/>                        

This works fine, but it’s not very nice, graphically speaking. It would be better to show different images to render the True/False (or On/Off) state, right? All you have to do is using an Image control instead of the checkbox, and binding its ImageUrl property to a protected/public function declared in the code-behind, that takes in input the True/False value, and returns the Url of the image to show. The image control is declared as follows:

‘ />

See also  5 Ways to Improve Customer Experience

About Our Editorial Process

At DevX, we’re dedicated to tech entrepreneurship. Our team closely follows industry shifts, new products, AI breakthroughs, technology trends, and funding announcements. Articles undergo thorough editing to ensure accuracy and clarity, reflecting DevX’s style and supporting entrepreneurs in the tech sphere.

See our full editorial policy.

About Our Journalist