Resetting via Javascript

[Tim Barton]

How do you clear the selection or go back to intial state via javascript?  I can do it from codebehind but it's faster on the client side.

Thanks,

Tim

[Rumen]

Hi Tim,

You may find useful the set_enabled() client-side method of RadButton -  https://www.telerik.com/forums/set-enabled-disabled-radbutton-from-client-side.

If this does not help, please explain your scenario with screenshots and also share your server side solution.

Best regards,
Rumen
Progress Telerik

[Tim Barton]

Hi Rumen,

For asp:Radbuttonlist I can clear the selection by doing the below code.  How do I do the same with RadRadioButtonList?

....
javascript:cCurrent();
.....

<asp:RadioButtonList ID="rdCurrent" runat="server" RepeatDirection="Horizontal" Width="110px" Font-Bold="true" Font Size="18px">
 <asp:ListItem  Text="Yes" Value="Yes"></asp:ListItem>
 <asp:ListItem  Text="No" Value="No"></asp:ListItem>
</asp:RadioButtonList>

function cCurrent() {
  clearRadioButtonList($get('<%= rdCurrent.ClientID %>'));
}

function clearRadioButtonList(elem) {

                        var elementRef = elem;
                        var inputElementArray = elementRef.getElementsByTagName('input');

                        for (var i = 0; i < inputElementArray.length; i++) {
                            var inputElement = inputElementArray[i];

                            inputElement.checked = false;
                        }
                        return false;
                    }

[Rumen]

Hi Tim,

You can get reference to all radio list items via the get_items() method and use the set_selected(false); method to reset their state:

<telerik:RadRadioButtonList ID="RadRadioButtonList1" runat="server" RepeatDirection="Horizontal" Width="110px" Font-Bold="true" Font-Size="18px">
    <Items>
        <telerik:ButtonListItem Text="Yes" Selected="true"  Value="Yes"></telerik:ButtonListItem>
        <telerik:ButtonListItem Text="No" Value="No"></telerik:ButtonListItem>
    </Items>
</telerik:RadRadioButtonList>
<asp:Button Text="Reset Radio List" OnClientClick="resetRadioList(); return false;" runat="server" />
<script type="text/javascript">
    function resetRadioList() {
        var radioButtonList = $find("<%=RadRadioButtonList1.ClientID%>");
        var items = radioButtonList.get_items();
        for (var i = 0; i < items.length; i++) {
                items[i].set_selected(false);
            }
        }
</script>

Best regards,
Rumen
Progress Telerik

[Rumen]

Hi there,

I also created a knowledge base article on this topic: Reset RadioButtonList state. It features server and client-side solutions.

Regards,
Rumen
Progress Telerik