adding radio buttons to add to cart button form

I have added 2 radio buttons to my add to cart form, and now I need to know how to make it so they qualify the fields under them. I simply added them to the form where they need to be: you can view my test page at: http://www.bandofhonor.com/tag_single_rbtest.php (left side, choice between Inscription and Logo)

The actual working page which needs these buttons can be seen at: http://www.bandofhonor.com/tag_single.php. We need to force the customer to CHOOSE between Inscription and Logo on side 1. Right now it is possible for them to choose both...

I tried to find documentation on this but couldn't find anything that matches my situation.

If they both have the same name attribute, then only one will be able to be selected at a time.

Yes they do have the same name attribute, but I am trying to make the part underneath each one where they either fill in an inscription or choose a logo so that they can only do one or the other. It actually works the way I have it now, but it is possible for them to mistakenly put in an inscription AND choose a logo other than "None".

This will become a bigger issue on the double tags order page where they have two 2-sided tags to fill out choices on.

I see... this would require some hand written javascript code to pull off.

You would add an onclick event to both radio buttons that calls a javascript function. That function would read which radio was selected and then enable or disable the appropriate form elements on the page. There is no way to do this without hand coding, but it is only a couple of lines of code and shouldn't be too difficult to pull off.

I suspected it would be something like that. I am fairly good at html coding but not great at java or php. Most of our other clients have simple needs and this is our only shopping cart client. Unfortunately even though there are really only 2 products the variables are difficult to quantify and capture. I have tried to keep it simple! So I guess now I will need to figure out the javascript. At least it works the way it is, even there is potential for mistakes. If you have any suggestions it would be appreciated...

Our client is a police officer. At least he is one of the nice ones!

If you attach a copy of the page so I can look at it, I can give more precise guidance and maybe even whip up a script for you as a starting point.

That would be much appreciated. There are 2 pages with this problem, I started with the easier one! It's attached.

You could add this to each radio button: onclick="enableDisableFields()"

Then make sure you add an id property that matches the name for all of the form elements you want to be enabled or disabled. Then add the javascript to page similar to:

<script>
function enableDisableFields() {
if (document.getElementById("side1_0").checked) {
document.getElementById("boh_2_Inscription1_Add").setAttribute('disabled','false');
document.getElementById("boh_2_Inscription2_Add").setAttribute('disabled','false');
document.getElementById("boh_2_Inscription3_Add").setAttribute('disabled','false');
document.getElementById("boh_2_Logo_Add").setAttribute('disabled','true');
document.getElementById("boh_2_Logo_Add").selectedIndex = 0;
} else {
document.getElementById("boh_2_Inscription1_Add").setAttribute('disabled','true');
document.getElementById("boh_2_Inscription2_Add").setAttribute('disabled','true');
document.getElementById("boh_2_Inscription3_Add").setAttribute('disabled','true');
document.getElementById("boh_2_Inscription1_Add").value = "";
document.getElementById("boh_2_Inscription2_Add").value = "";
document.getElementById("boh_2_Inscription3_Add").value = "";
document.getElementById("boh_2_Logo_Add").setAttribute('disabled','false');
}
}
</script>

I haven't tested this script, but it should be close and hopefully will get you on your way so you can get it working from here.

OK, good. I just looked at the code for the radio buttons input, and the id property right now reads: id="side1_0" on the first button and: id="side1_1" on the second button. Do I need to make those both the same, such as: id="side1_0" or simply: id="side1"? Also there are three lines of inscription controlled by one radio button and one dropdown menu controlled by the other one, I guess I need to add this same id property to all of these fields?

Also do I put the javascript right there in the body, or within the head tag?

The ID values of the two radios should remain different as they are.

Yes, you would add all of the fields to the list using the same syntax of the three I added.

You can add the javascript inside a <script> tag to the bottom of the page just before the </body>