Set the checkbox to display as radiobutton

[Michael]

How can I change the CheckBox or CheckBox image to RadioButton or RadioButton image on the RadDropDownTree?
In RadWinForms, the is a CheckType.RadioButton that allows what I am trying to implement.

I have tried to  set the checkbox image of the raddropdowntree to display as a radio button. While inspecting the markup, it seems that if we could change the following:
    <input class="rtChk" type="checkbox">
to:
    <input class="rtChk" type="radio">
it displays the CheckBox as a RadioButton.

This would give the customer a visual clue to single selection only whereas the checkbox visually implies multi selection.

I also tried using CSS to "retrieve" the correct sprite.

<style type="text/css">
    div.RadTreeView_Windows7 .rtIn             { background-position: 80 0; }
    div.RadTreeView_Windows7 .rtHover .rtIn    { background-position: 80 -40; }
    div.RadTreeView_Windows7 .rtSelected .rtIn { background-position: 80 -40; }
</style>

[Shinu]

Hi Michael,

Please have a look into the following JavaScript to change the CheckBox to RadioButton.

JavaScript:

<script type="text/javascript">
    function pageLoad() {
        var checkbox = $(".rtChk");
        checkbox.replaceWith('<input type="radio" name="' + checkbox.attr('name') + '" value="' + checkbox.attr('value') + '" />');
    }
</script>

Thanks,
Shinu.

[Michael]

Thanks,
It did replace all the checkboxes with radiobuttons but now I cannot select/unselect any item in the tree. :(
I would still prefer to just use CSS to replace the checkbox images as the radFormToggleSprite.png has both images available. See attached file.

Edit: I modified your code snippet to

<script type="text/javascript">
    function pageLoad() {
        var checkbox = $(".rtChk");
        checkbox.replaceWith('<input class="rtChk" type="radio" name="' + checkbox.attr('name') + '" value="' + checkbox.attr('value') + '" />');
    }
</script>

 and it now works.