470,594 Members | 1,502 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 470,594 developers. It's quick & easy.

Textbox appearing after radio button is selected--new code

19
I changed my code...Now everytime i click a radio button, a text box appears...What i want is when i hit a particular radio button, the textbox should only appear next to that radio button. And if another radio button is selected, then the 1st textbox should disappear and should display in front of the new radio button selected.

Following is my code:

<html>

<head>

<script type="text/javascript">

function Markit(name) {

if (name == 'a')
{

var txtInput = document.createElement("INPUT");
txtInput.type="text";
txtInput.id="txtInput"
txtInput.value=" ";
txtInput.size="30"
DivAppend.appendChild(txtInput);


}

if (name == 'b'){
var txtInput = document.createElement("INPUT");
txtInput.type="text";
txtInput.id="txtInput"
txtInput.value=" ";
txtInput.size="30"
DivAppend.appendChild(txtInput);


}
}
</script>

</head>

<bodyonLoad="appendObj();">
<div id="DivAppend">
</div>



<br />

<input onclick="Markit('a')" type="radio" name="a" value="y">Male
<br />

<input onclick="Markit('b')" type="radio" name="a" value="n">Female
<br />
</body>
</html>


Thanks
Jan 9 '07 #1
2 9767
AricC
1,892 Expert 1GB
Have you thought about putting the radio buttons and text boxes in a 2 column table?
Jan 9 '07 #2
acoder
16,027 Expert Mod 8TB
This is a Javascript problem. Are you sure you want to create a new text box every time a radio button is clicked or do you want to move the text box from one radio button to the other?

If you want to move then you should move the div instead of creating a new object every time. If you want to delete the old object, you need to remove it from the div. At the moment, your code adds text boxes with the same name to the div each time a radio button is clicked and the div appears before the radio buttons.

Why not define two divs, one after each radio button? When a radio button is clicked, the div corresponding to the radio button shows its text box and hides the other one using
Expand|Select|Wrap|Line Numbers
  1. document.getElementById(object).style.visibility = 'visible'
and
Expand|Select|Wrap|Line Numbers
  1. document.getElementById(id).style.visibility = 'hidden'
respectively.
Jan 9 '07 #3

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

1 post views Thread by Michael Albanese | last post: by
2 posts views Thread by Bart Verbeke | last post: by
2 posts views Thread by teddy.am | last post: by
2 posts views Thread by Peted | last post: by
reply views Thread by Gary W. Smith | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.