How to show unchecked checkbox instead of x when binding value is null?

1 Answer 50 Views
GridView
B
Top achievements
Rank 1
B asked on 14 Jan 2022, 08:25 PM

Hello, 

I have a checkbox in a Telerik GridViewDataColumn with its IsChecked binding set to a data source that could be 1, 0, or Null.

When the value of the data element is 1, it displays a check.

When the value of the data element is 0, it displays an unchecked checkbox.

But when the value of the data element is Null, it displays an X. That's an issue.

How can I change the display to also show an unchecked checkbox when the value is Null? (It needs to look the same way that it looks when the data element value is 0)

Thank you!

1 Answer, 1 is accepted

Sort by
0
Martin Ivanov
Telerik team
answered on 18 Jan 2022, 09:29 PM

Hello,

The WPF native CheckBox control supports three-state feature, which means that there is an additional state (indeterminate) for the situation when the IsChecked property is null. This indeterminate state kicks-in every time, the IsChecked property holds a null value and this cannot be disabled. You can only disable/enable the three-state feature when using the mouse click event by setting the IsThreeState property of the CheckBox (which derives from ToggleButton).

To achieve you requirement, you can use two approaches. The first one is to extract the ControlTemplate of the native CheckBox control and remove the visual state (or the trigger if you use a newer theme) that displays the geometry for the indeterminate state and replace it with the one for the false (0) state. Or, alternatively, you can coerce the boolean value before passing it to the CheckBox. You can do this in the view model, where the boolean property is defined, or using an IValueConverter with the data binding. In this case, you can check if the value is null and return false for the IsChecked property.  

Regards,
Martin Ivanov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
GridView
Asked by
B
Top achievements
Rank 1
Answers by
Martin Ivanov
Telerik team
Share this question
or