We help IT Professionals succeed at work.

Setting Textbox Focus based on Radio Button (ASP.NET C# Javascript)

I'm not very good with JavaScript (still learning).  I have an ASPX page that has 3 radio buttons, and a textbox associated with each radio button. When the user clicks a particular radio button, I want to set the focus to a certain textbox, and disable the other textboxes.

How could I do this using javascript and not posting back?

For instance, in the code below, if I select radCityState, I want the txtCity textbox to get focus and I want to disable txtOrgName and txtZip...
<p>
	<asp:RadioButton ID="radOrgName" Text="Search by Organization Name:" Checked="true" GroupName="radOrgSearchType" runat="server" />                        
	<asp:TextBox ID="txtOrgName" MaxLength="200" Width="200px" runat="server" />
</p>   
<p>
	<asp:RadioButton ID="radCityState" Text="Search by City and State:" GroupName="radOrgSearchType" runat="server" />
	<asp:TextBox ID="txtCity" runat="server" />, 
	<asp:DropDownList ID="ddlStates" ForeColor="#666666" runat="server" />
</p>                              
<p>
	<asp:RadioButton ID="radZip" Text="Search by Postal Code:" GroupName="radOrgSearchType" runat="server" />
	<asp:TextBox ID="txtZip" MaxLength="5" runat="server" /> 
</p>                   
<p>
	<asp:Button ID="btnSearchOrgs" Text="Search" runat="server" onclick="btnSearchOrgs_Click" >
</p>

Open in new window

Comment
Watch Question

Chief Technology Ninja
Distinguished Expert 2019
Commented:
Hi mandi224, 
You could achieve the same functionality via using AJAX but lets try with JavaScript for now.
at the end of the page add this script
<script language="JavaScript">
function ValidateUI(sourceCheckBox, targetTextBox)
{
document.getElementById(targetTextBox).focus();

if(sourceCheckBox == "radCityState")
{
document.getElementById("txtOrgName").disabled=true;
document.getElementById("txtZip").disabled=true;
}
}
</script>
Now to call this function

<asp:RadioButton ID="radOrgName" Text="Search by Organization Name:" Checked="true" GroupName="radOrgSearchType" runat="server" onClick="ValidateUI(this.id, "txtCity");" />                        
       

Repeat the if loop as per your requirements.
Let me know if you need help with it.
Regards,
Chinmay