Need Some Help :)

**DegreeZ** · 11-16-2005 11:22 AM

Hi,

I have the following code:

Code:

<HTML>
	<HEAD>
		<TITLE>Pizza Query Form</TITLE>
	</HEAD>
	<BODY>
		<H1>Pizza Query</H1>
		<FORM METHOD="GET" ACTION="pizzadatatwo">
		<INPUT TYPE="radio" NAME="radio" VALUE="1">City
		<INPUT TYPE="text" NAME="city"><BR>
		<INPUT TYPE="radio" NAME="radio" VALUE="2">Customer Name
		<INPUT TYPE="text" NAME="name"><BR>
		<INPUT TYPE="radio" NAME="radio" VALUE="3">Pizza Size
		<INPUT TYPE="text" NAME="size"><BR>
		<INPUT TYPE="SUBMIT"><BR>
		<INPUT TYPE="RESET">
		</FORM>	
	</BODY>
</HTML>

Once the user clicks the first radio button (next to city), i want the text field beside it to be enabled, and for the other 2 text boxes (name and size) to be disabled and have the word N/A inside of it. If the user selects the second radio button (next to name) i want the text field beside it to be enabled, and for the other 2 text boxes (city and size) to be disabled and have the word N/A inside of it. Finally, if the user selects the third radio button (next to size) i want the text field beside it to be enabled, and for the other 2 text boxes (city and name) to be disabled and have the word N/A inside of it.

I would greatly appreciate a javascript pro (someone who could whip this up in 2 seconds) to help me with this. Or some tutorial links on the subject matter.

Thanks!

**kelly23** · 11-16-2005 07:54 PM

I'm sure there's probably a more elegant way of doing this, but it works:

Code:

<HTML>
	<HEAD>
		<TITLE>Pizza Query Form</TITLE>
		<script type="text/javascript">
		function enableTextBox(){
		var city = document.form1.city;
		var name = document.form1.name;
		var size = document.form1.size;
		
		if(document.form1.radioBtn[0].checked){
		city.disabled = false;
		city.value = "";
		name.disabled = true;
		name.value = "N/A";
		size.disabled = true;		
		size.value = "N/A";
		}
		else if(document.form1.radioBtn[1].checked){
		name.disabled = false;
		name.value = "";
		city.disabled = true;
		city.value = "N/A";
		size.disabled = true;
		size.value = "N/A";
		}
		else if(document.form1.radioBtn[2].checked){
		size.disabled = false;
		size.value = "";
		name.disabled = true;
		name.value = "N/A";
		city.disabled = true;
		city.value = "N/A";
		}
	}
	    </script>
	</HEAD>
	<BODY>
		<H1>Pizza Query</H1>
		<FORM METHOD="GET" ACTION="pizzadatatwo" name="form1">
		<INPUT TYPE="radio" NAME="radioBtn" onClick="enableTextBox()" VALUE="1">City
		<INPUT TYPE="text" NAME="city"  disabled size="20"><BR>
		<INPUT TYPE="radio" NAME="radioBtn" onClick="enableTextBox()" VALUE="2">Customer Name
		<INPUT TYPE="text" NAME="name"  disabled size="20"><BR>
		<INPUT TYPE="radio" NAME="radioBtn" onClick="enableTextBox()" VALUE="3">Pizza Size
		<INPUT TYPE="text" NAME="size"  disabled size="20"><BR>
		<INPUT TYPE="SUBMIT"><BR>
		<INPUT TYPE="RESET">
		</FORM>	
	</BODY>
</HTML>

**Kravvitz** · 11-16-2005 10:23 PM

This question was also answered on DevShed.

DegreeZ, in the furture please don't post the same question on multiple forums on the same day.

kelly23, I suggest you read the other thread.

Thread: Need Some Help :)

Thread Tools

Display

Need Some Help :)

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions