Learn how to a build a cloud-first strategyRegister Now

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2973
  • Last Modified:

Radio Button to show Hidden Text Box


I'm using a radio button to show a hidden text box depending on whether the user selects, "yes", or ,"no".

Originally the best way I found of doing this was to use radio input buttons (simply because I could not do what I needed with an asp radiobutton). I called a javascript function to show the hidden text box. This worked fine and my textbox showed when the user selected no, just like I wanted. (See code below).

My problem is that I am using session variables. I want to allow the user to leave the page and when they return to the page, if they have selected items they will still be selected. This is working fine with my textboxes. But I don't know how to populate the radiobutton using my session variables.
In my page load I have tried setting both the text and the value properties of the radiolist to my session variable. They are taking the value alllright, but the radio button is not showing as selected.

I want the radio button to show the value of the session variable as selected. It will either be, "yes", or ,"no".

Does anybody know how I can do this please?

//this is my radio button
<fieldset style="width: 162px; position:absolute; top: 75%; left: 7%; 
       border-style: none; right: 563px; background-color:#E2EDFE;" >
      <input type="radio" name="YesNoButton" value="Yes" onclick="checkMixed(this);"/> 
      <input type="radio" name="YesNoButton" value="No"  onclick="checkMixed(this);"/> No
//this is my javascript function to check what the user has pressed
function checkMixed(el)
//if no is selected, the hidden label and textbox is displayed. 
//The next item is repositioned on the page
   if (el.value == "No")
  document.getElementById('<%=YesNoButton.ClientID%>').value = 'No';
  document.getElementById('<%=myTextBox.ClientID%>').style.display = '';
  document.getElementById('<%=LblFooter.ClientID%>').style.display = '';
 //If yes is selected continue
document.getElementById('<%=YesNoButton.ClientID%>').value = 'Yes'; document.getElementById('<%=TxtWhen.ClientID%>').style.display ='none'; 
//This is the code I was putting into my page load in vb
//I had already created the session variable elsewhere in my code
//I also tried using .value here aswell
//I want the user to see what they selected the original time if they made a selection
YesNoButton.Text = Session("YesNo")

Open in new window

2 Solutions
For a javascript solution, first you modify the radio button a bit by adding id
<input type="radio" id="yesRadio" name="YesNoButton" value="Yes" onclick="checkMixed(this);"/>   Yes
 <input type="radio" id="noRadio" name="YesNoButton" value="No"  onclick="checkMixed(this);"/> No

javascript function to check the box is

function checkRadio(ch) //ch is your session variable store ing yes/no
  if(ch == 'yes')
   document.getElementById('yesRadio').checked = true;
  else if( ch == 'no')
   document.getElementById('noRadio').checked = true;

Open in new window

in your code you have to add like

<fieldset style="width: 162px; position:absolute; top: 75%; left: 7%;
       border-style: none; right: 563px; background-color:#E2EDFE;" >
      <input type="radio" name="YesNoButton" value="Yes" onclick="checkMixed(this);" <% if Session("YesNo") = "Yes" then %> CHECKED <% END IF %>   />
      <input type="radio" name="YesNoButton" value="No"  onclick="checkMixed(this);" <% if Session("YesNo") = "No" then %> CHECKED <% END IF %> /> No
xdubitAuthor Commented:
Thanks lads.

I figured it out myself last night but I awarded you the points between you for taking the time to respond.

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now