How to assign multiple text box to a radio button?

Bbob

How do I assign multiple textbox in a single radio button?

I want to enable a textbox based on what radio button is clicked.

In a single form I have 6 textbox and 3 radio buttons. How do I assign 2 or more textbox to a single radio button?

onclick="enableElement(this.form.elements['box1', 'box2']);"> doesnt seem to work. It only enables box2 and not box1

Krik

You can't access two different objects in one object reference. In essence your telling it I want "myvar" to equal 1 and then equal 2 and expecting "myvar" to be both 1 and 2.

var myvar = 1;
var myvar = 2;

if(myvar == 1) {
    // do a very important task
}
if(myvar == 2) {
    //do another very important task
}

I guarantee the first "if" will not happen, just like in your code.

enableElement(this.form.elements['box1'], this.form.elements['box2']);

Now, I personally think directly accessing the element by its id is better.

enableElement(document.getElementById('box1'), document.getElementById('box2'));

Bbob

Krik;10960677 wrote:
You can't access two different objects in one object reference. In essence your telling it I want "myvar" to equal 1 and then equal 2 and expecting "myvar" to be both 1 and 2.
var myvar = 1;
var myvar = 2;

if(myvar == 1) {
    // do a very important task
}
if(myvar == 2) {
    //do another very important task
}
I guarantee the first "if" will not happen, just like in your code.
enableElement(this.form.elements['box1'], this.form.elements['box2']);
Now, I personally think directly accessing the element by its id is better.
enableElement(document.getElementById('box1'), document.getElementById('box2'));

Im currently try to use this code. Im confused on how to add another var

<script type="text/javascript">
var currentEnabled = null;
function enableElement(elem) 
{
if (currentEnabled) 
* * {
* * * * currentEnabled.disabled = true;
* * }
elem.disabled = false;
currentEnabled = elem;
}
</script>
<form action="">
<input type="text" name="inp1" disabled="disabled">
<input type="radio" name="sel" value="1"
onclick="enableElement(this.form.elements['inp1']);">
<br>
<input type="text" name="inp2" disabled="disabled">
<input type="radio" name="sel" value="2"
onclick="enableElement(this.form.elements['inp2']);">
<br>
<input type="text" name="inp3" disabled="disabled">
<input type="radio" name="sel" value="3"
onclick="enableElement(this.form.elements[inp3'']);">
</form>

johanafm

In my opinion, the easiest thing is to toggle by element grouping from the DOM tree perspective. Other options are of course possible.

<script type="text/javascript">
function toggleGroup(o, type, subtype) {
	// disable all text inputs that are descendants of the radio buttons grandparent
	var pp = o.parentNode.parentNode;
	var os = pp.getElementsByTagName(type);
	for (var i = 0; i < os.length; ++i) {
		if (os[i].type == subtype) {
			os[i].disabled = true;
		}
	}

// then enable all text inputs that have the same parent as the radio button
var p = o.parentNode;
var os = p.getElementsByTagName(type);
for (var i = 0; i < os.length; ++i) {
	if (os[i].type == subtype) {
		os[i].disabled = false;
	}
}
}
</script>
</head>
<body>
	<div>
		<div>
			<input type="text" value="1"/>
			<input type="text" value="2"/>
			<input type="radio" name="selectGroup" checked="checked" onchange="toggleGroup(this, 'input', 'text');"/>
		</div>
		<div>
			<input type="text" value="3" disabled="disabled"/>
			<input type="text" value="4" disabled="disabled"/>
			<input type="radio" name="selectGroup" onchange="toggleGroup(this, 'input', 'text');"/>
		</div>
		<div>
			<input type="text" value="5" disabled="disabled"/>
			<input type="text" value="6" disabled="disabled"/>
			<input type="radio" name="selectGroup" onchange="toggleGroup(this, 'input', 'text');"/>
		</div>
	</div>

Bbob

Hi thanks for the reply

I have a couple of questions.

In function toggleGroup (o, type, subtype) - what does o mean?

Ive also noticed that which textbox will enable depending on their divs. What if all my textbox/radio button inside a single div?

johanafm

For one control to toggle several others in a sensible fashion, those other controls need to be somehow grouped. And there is nothing preventing you from chaning

<div>
	lots of elements
</div>

into

<div>
	lots of elements
	<div>
		stuff to be controlled by your radio buttons
	</div>
	lots of elements
</div>