Need help with radio buttons on a form

**tryin_to_learn** · Jul 22, 2007 23:40

I have this block of code:

PHP Code:


<tr class="brownLabels">

    <td><label for="isGeneric">Is this a generic drug? </label></td>

    <td><input type="radio" name="f_addMeds[isGeneric]" value="1" <?php if(isset($f_addMeds["isGeneric"]) && $f_addMeds["isGeneric"] == "1") echo "checked='checked'"; ?> /> Yes 

        <input type="radio" name="f_addMeds[isGeneric]" value="0" <?php if(isset($f_addMeds["isGeneric"]) && $f_addMeds["isGeneric"] == "0") echo "checked='checked'"; ?> /> No </td>

</tr>

                

<tr class="brownLabels" id="generic" style="display:none; ">

    <td><label for="genericFor">Generic for: </label></td>

    <td><input type="text" id="genericFor" name="f_addMeds[genericFor]" value="<?php if(isset($f_addMeds["genericFor"])) echo $f_addMeds["genericFor"];?>" /></td>

</tr>

What I'd like is if the user selects the "Yes" radio button, it fires the JavaScript that changes the "display:none" on the following tr so it's displayed. If the question were presented in a link instead of a radio button, the appropriate syntax would be:

HTML Code:

<a href="#" id="isGenericQuestion" onclick="javascript:showHide('generic', 1); showHide('isGenericQuestion', 0); ">Click here if this is a generic drug.</a>

Notice that to be parallel with what the JavaScript does, if the user changes their mind after they've selected "Yes" and goes back and selects "No", the subsequent tr would disappear again.

How can I write PHP to extract the values from the radio buttons to trigger the JavaScript? Or if there's a way to do the same thing using only PHP, that's fine, too.

**tryin_to_learn** · Jul 23, 2007 18:15

Any ideas on this?

**cranial-bore** · Jul 23, 2007 19:18

PHP can't trigger Javascript except by writing it to the page. The PHP execution is completely finished (server side) before JS even gets a look in.

PHP also has no knowledge of client side interactions such as clicking radio buttons, displaying rows etc. This is all JS.

Hiding the row by default also makes the form unusable (properly) for users with JS disabled. You should display the row by default and hide it with JS, then be ready to show/hide it depending on the state of the checkbox.

So the best approach is this:
1. Show all rows by default. Give the #generic row a class (or use its ID) to hide it on page load with JS.

2. Attach a JS listener to the f_addMeds[isGeneric] radios. When clicked toggle the state of #generic.

3. When processing the form in PHP only use the input from the #generic row if the drug was specified as being generic. In case the submitter had JS turned off they may have filled in a value here when they shouldn't have.

I recommend Yahoo User Interface Library to attach listeners to your radios and respond to their actions.

**tryin_to_learn** · Jul 23, 2007 20:57

Thanks for the tips. I'll check into the link -- haven't used JS listeners although I have used them with ActionScript so I have some sense of what they do.

Nice website.

**Raju Gautam** · Jul 23, 2007 21:29

Umm, I am not sure whether i could understand your problem but please check out this code if helps out:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script>]
function ShowHide(){
	if(document.frm1.f_addMeds[0].checked == true){
		document.getElementById('generic').style.display = '';
	}
	else if(document.frm1.f_addMeds[1].checked == true){
		document.getElementById('generic').style.display = 'none';
	}
}
</script>
</head>
<body>
<form name="frm1">
<table width="400" cellpadding="3" cellspacing="1">
	<tr class="brownLabels">
		<td><label for="isGeneric">Is this a generic drug? </label></td>
		<td><input type="radio" onClick="ShowHide;" name="f_addMeds" value="1" /> Yes 
			<input type="radio" onClick="ShowHide;" name="f_addMeds" value="0" /> No </td>
	</tr>
	<tr class="brownLabels" id="generic" style="display:none; ">
		<td><label for="genericFor">Generic for: </label></td>
		<td><input type="text" id="genericFor" name="f_addMeds[genericFor]" /></td>
	</tr>
</table>
</form>
</body>
</html>

**tryin_to_learn** · Jul 24, 2007 13:11

That sure looks like it would work, rajug, but I tried it and nothing happened. Is it working on your machine?

User Tag List

Thread: Need help with radio buttons on a form

Thread Tools

Display

Need help with radio buttons on a form

Bookmarks

Bookmarks

Posting Permissions