Hey guys,

I have a form made up, and there is an option where the user selects "Male/Female". The way its set up is as follows:

var lastLink;
	function setLink(theLink){
	  if(lastLink) lastLink.className="genderSelect";
	  theLink.className="selected";
	  lastLink=theLink;
	  return false;
	}
<ul>
   <li>
      <a id="genderMale" onClick="return setLink(this)" class="genderSelect" href="#">Male</a>
   </li>
   <li>
      <a id="genderFemale" onClick="return setLink(this)" class="genderSelect" href="#">Female</a>
   </li>
</ul>

What happens is that when the user selects a gender, the javascript changes the class of the list item to 'selected' which has its own properties.

What I need to do is send the information that is attached to the selected class through my form and into my database.

How would I create and pass that variable to my forms post file?

Thanks for any help,
Colm

Colm,

The conventional way would be to have Male/Female radio buttons in the form and a Submit button. This should look after all user interface aspects. If necessary, you can still attach a function to do other things when the radio buttons are clicked.

Airshow

Thanks for the reply,

I followed your advice and made the options radio buttons, and here is what I have now:

<input type="radio" name="gender" value="male" style="display:none">
<label for="male"><p class="genSelect" onClick="return setLink2(this)">Male</p></label>

<input type="radio" name="gender" value="female" style="display:none">
<label for="female"><p class="genSelect" onClick="return setLink2(this)">Female</p></label>

As you can see, I don't want the user to see the radio buttons, but when the text is clicked, I want the corresponding radio button to be selected and sent over POST.

Can anyone see anything wrong with the above? Its not working for me and I have tested it a lot in different variations and debugged it as best I can. I cant find any info on it either.

Thanks a lot guys.

Thanks for the comment ankitjain_dce, but I know how to submit radio buttons through a form and I didn't post the rest of the form code because it is quite a long form.

Anyway, I got it working in the end. What I did was I went back to basics. I got the form working with just the radio buttons. The radio buttons and the labels. Then I hid the radio buttons and then I styled the label.

I followed this to style the radio button labels: http://stackoverflow.com/questions/43643/how-do-i-style-css-radio-buttons-and-labels

Thanks for all the help and suggestions as usual.

This question has already been answered. Start a new discussion instead.