Check option selected for disabling other control client-side

[Ciupaz]

Hello,
I need a JavaScript function that disable one control on my aspx page 
where the user select a particular item in a RadButtonList. 

I need to make it client-side, not server-side, for performance reasons.

How can I write it? (I don't know JavaScript). 

Thanks in advance. 

Luis

[Ciupaz]

 

I've made in this way: 

 

function myListItemClick(e) {
          alert('Selected value: ' + e.value);
        }

 

<telerik:RadRadioButtonList runat="server" ID="rblPeriodo" AutoPostBack="true"
                  BackColor="White" Height="135px"
                  CssClass="form-control" SelectedIndex="0" SelectedValue="1" Direction="Vertical">
                  <ClientEvents OnItemClicked="myListItemClick(this);" />
                  <Items>
                    <telerik:ButtonListItem Text="Questa settimana" Selected="true" Value="1" />
                    <telerik:ButtonListItem Text="Prossima settimana" Value="2" />
                    <telerik:ButtonListItem Text="Questo mese" Value="3" />
                    <telerik:ButtonListItem Text="Prossimo mese" Value="4" />
                    <telerik:ButtonListItem Text="Personalizzata" Value="-1" />
                  </Items>
                </telerik:RadRadioButtonList>

 

but nothing happens.

What's wrong? 

Luigi

 

[Doncho]

Hi Luigi,

Concerning the sample code:

Here is a slight modification to the snippets provided to make it show an alert with the value of the currently selected item:

<ClientEvents OnItemClicked="myListItemClick" />

JavaScript

function myListItemClick(sender, args) {
    var selectedItem = args.get_item();
    var value = selectedItem.get_value();
    alert('Selected value: ' + value);
}

You can find more on the exposed client-side methods and properties of the RadRadioButtonList in the Client-side Programming Overview article.

If the desired behavior on selection is disabling a Telerik control on the page you can try the following in the OnItemClicked event listener:

• Get a client-side reference to the desired control, see how in the Get Client-side Reference to a Control Object.
• Use the client-side API of the respective control to disable/enable it - set_enable(true/false)

Here is a sample code you can test:

<script>
    function onItemClicked(sender, args) {
        var selectedItem = args.get_item();
        var value = selectedItem.get_value();
        var button = $find('<%= RadButton1.ClientID %>');
        if (value == "2") {
            button.set_enabled(false);
        }
        else {
            button.set_enabled(true);
        }
    }
</script>
<telerik:RadRadioButtonList runat="server" ID="RadRadioButtonList1" AutoPostBack="false">
    <ClientEvents OnItemClicked="onItemClicked" />
    <Items>
        <telerik:ButtonListItem Text="Button enabled" Selected="true" Value="1" />
        <telerik:ButtonListItem Text="Button disabled" Value="2" />
    </Items>
</telerik:RadRadioButtonList>

<telerik:RadButton ID="RadButton1" runat="server" Text="RadButton"></telerik:RadButton>

I hope that will prove helpful!

Kind regards,
Doncho
Progress Telerik

[Ciupaz]

That's work!

Thank you so much Doncho. 

Luigi