show textbox enable true or false based on dropdownlist select

Question

Hello

I have two textbox1 and textbox2 in asp.net c# with one dropdownlist1

if i select Item1 in dropdownlist textbox1 enble true and textbox2 enable false

if i select Item2 in dropdownlist textbox2 enble true and textbox1 enable false

how to do without postback in asp.net c#

Thanks

Answer 1

Hi @RAVI ,
You can put the DropDownList in an AJAX UpdatePanel so it only updates that part of the page instead of reloading the whole page.

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>  
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">  
            <ContentTemplate>    
                <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">  
                    <asp:ListItem Text="Item1" Value1="1"></asp:ListItem>  
                    <asp:ListItem Text="Item2" Value2="2"></asp:ListItem>  
                </asp:DropDownList>  
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>  
                <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>  
  </ContentTemplate>  
    <Triggers>  
        <asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />  
    </Triggers>  
</asp:UpdatePanel>    

Or you can choose to use JavaScript to implement the DropDownList element's onChange event.

 function Change(){  
            var tb1 = document.getElementById(" < %=TextBox1.ClientID % >");  
            var tb2 = document.getElementById("<%=TextBox2.ClientID%>");  
             var ddl = document.getElementById(" < % =DropDownList1.ClientID% > ");  

        if (ddl.options[ddl.selectedIndex].text == "Item1") {  
            tb2.disabled = false;  
            tb1.disabled = true;  
        }  
        if (ddl.options[ddl.selectedIndex].text == "Item2") {  
            tb1.disabled = false;  
            tb2.disabled = true;  
        }  

    }  

---

  <asp:DropDownList ID="DropDownList1" runat="server"  oncha nge="Ch ange()" >  
                <asp:ListItem Text="Item1" Value1="1"></asp:ListItem>  
                <asp:ListItem Text="Item2" Value2="2"></asp:ListItem>  
            </asp:DropDownList>  
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>  
            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>  

Best regards,
Lan Huang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.