CODEWITHSUNDEEP
javascriptc#jqueryasp.net
OLDMONK
OLDMONK

Reputation: 382

Disable other RadioButtons in an Asp.net RadioButtonList if one among them is selected

I need to disable other asp.net radio buttons when one of them is selected.There are three radio buttons.Like for example is Cash radio button is selected,other two from the listitem should be disabled.I did some research and did disabled the other two when the third one is selected.But on my code behind page it gives me null value for the selectedradio button.here is my code:

My .aspx

 <div class="col-sm-4" style="padding-top:4px ; margin-top:-8px">
    <asp:RadioButtonList runat="server" ID="loanTypeCheck" CssClass="pull-right" RepeatDirection="Horizontal">
    <asp:ListItem Value="Cash" Text="&nbsp;&nbsp;Cash&nbsp;&nbsp;"/>
    <asp:ListItem Value="Non-Cash" Text="&nbsp;&nbsp;Non-Cash&nbsp;&nbsp;" />
    <asp:ListItem Value="Dharauti" Text="&nbsp;&nbsp;Dharauti&nbsp;&nbsp;" />
      
    </asp:RadioButtonList>
</div>

My code behind

protected void SaveButton_Click(object sender, EventArgs e)
{
    if (IsFormValidForSave())
    {
        var loanReceipt = GetLoanReceiptFromForm();
        var transactionsDetails = new List<TransactionDetail>();

        if (loanTypeCheck.SelectedValue == "Cash")
        {
           //
        }
    }
}

And here is my JavaScript to disable the radio buttons

$('input[type=radio]').change(function () {
    $("#<%=loanTypeCheck.ClientID   %>").find('input').prop('disabled', true);
});

Everything works in the UI but I get null value in my loanTypeCheck.SelectedValue in code behind.

Upvotes: 1

Views: 1059

Answers (1)

Martin Parenteau
Martin Parenteau

Reputation: 73721

You can disable the unselected radio buttons with the :not(:checked) selector:

$('#<%= loanTypeCheck.ClientID %>').change(function () {
    $(this).find('input[type=radio]:not(:checked)').prop('disabled', true);
});

Keeping the checked radio button enabled will allow the selected value to be posted back.

Upvotes: 1

Related Questions