Select radio buttons according to dropdown list in asp.net

0
votes

I'm basically trying to bind the dropdown list with the radio buttons. there are 4 options in the dropdown menu according to which the radio buttons should be selected. with the first two options, the radio buttons should be active and with the rest of two objects in the dropdown menu, the radio buttons should become inactive.

here is my front end code for dropdown:

<asp:DropDownList ID="ddLType" runat="server" Width="406px" Height="23px">
<asp:ListItem Value="Prof">Professional</asp:ListItem>
<asp:ListItem>Enterprise</asp:ListItem>
<asp:ListItem>Maintanence</asp:ListItem>
<asp:ListItem>Reporting</asp:ListItem>
</asp:DropDownList>

here is my code for radio buttons:

<asp:RadioButtonList ID="rdoMeapSupport" RepeatDirection="Horizontal" runat="server" AutoPostBack="True" >
<asp:ListItem Value="1" Text="Yes" />
<asp:ListItem Value="0" Text="No" />                        
</asp:RadioButtonList>

if we select professional, the radio buttons should be active with yes as the checked option. with enterprise, both the buttons should be active but not selected. with maintenance and reporting, the buttons should become inactive.

3
c#asp.netdrop-down-menuradio-button
You can achive this easily with jquery. – Pradeep
try my new answer with asp.net itself. – Pradeep
When there is a client side facility available then why should we give load to server and make a client wait for the response, just for some css attribute(enable/disable), which can be changed by jquery/javascript? – user841123

3 Answers

1
votes

First of all you have to set the property of drop down list called AutoPostBack to true. You can do this by simply selecting your drop down list and set AutoPostBack = true from properties window. Then go to code behind file write these codes:

 protected void Page_Load(object sender, EventArgs e)
{
    if(!IsPostBack)
    {
        if (ddLType.SelectedValue == "Professional")
        {
            rdoMeapSupport.Enabled = true;
            rdoMeapSupport.SelectedValue = "Yes";
        }
    }


}

after that set event for your radio button list "SelectedIndexChanged" and paste this code inside that

 protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
    if (ddLType.SelectedValue == "Professional")
    {
        rdoMeapSupport.Enabled = true;
        rdoMeapSupport.SelectedValue = "Yes";
    }

    if (ddLType.SelectedValue == "Enterprise")
    {
        rdoMeapSupport.SelectedValue = null;
        rdoMeapSupport.Enabled = true;
    }

    if ((ddLType.SelectedValue == "Maintanence") || (ddLType.SelectedValue == "Reporting"))
    {
        rdoMeapSupport.SelectedValue = null;
        rdoMeapSupport.Enabled = false;
    }

}
1
votes

Apply AutoPostBack="true" attribute to the dropdown and do the below logic in the selected index change event.

<asp:DropDownList ID="ddLType" runat="server" Width="406px" Height="23px" 
            onselectedindexchanged="ddLType_SelectedIndexChanged" AutoPostBack="true" >
            <asp:ListItem Value="Prof">Professional</asp:ListItem>
            <asp:ListItem>Enterprise</asp:ListItem>
            <asp:ListItem>Maintanence</asp:ListItem>
            <asp:ListItem>Reporting</asp:ListItem>            
        </asp:DropDownList>
        <asp:RadioButtonList ID="rdoMeapSupport" RepeatDirection="Horizontal" runat="server"
            AutoPostBack="True">
            <asp:ListItem Value="1" Text="Yes" />
            <asp:ListItem Value="0" Text="No" />
        </asp:RadioButtonList>


protected void ddLType_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (ddLType.SelectedIndex == 0 || ddLType.SelectedIndex == 1)
            {
                rdoMeapSupport.Enabled = true;
            }
            else
            { rdoMeapSupport.Enabled = false; }
        }
0
votes

I think making radio buttons active, but not allowing to select is none of use, better you disable it.
You may use jquery for this:

<script>
  $(function () {
    $("# <%# ddLType.ClientID %>").change(function () {
      var selVal = $(this).val();
      if(selVal == "Prof"){
        $('#rb_Statusno').removeAttr('disabled');
      else
        $('#rb_Statusno').attr('disabled', true);
      }  
</script>

For more help you may go through this post.