How to use checkboxes and selects together?

[sfraise]

I'm working on an ajax member search which is working fine when using all select inputs, but I need to use some checkboxes instead of selects for some options. It seems I need to change some of the script in order to check if a checkbox is checked or not and to only allow one checked at a time.

Here's my ajax:

<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
	var ajaxRequest;  // The variable that makes Ajax possible!
	
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			var ajaxDisplay = document.getElementById('ajaxDiv');
			ajaxDisplay.innerHTML = ajaxRequest.responseText;
		}
	}

	var sex = document.getElementById('sex').value;
	var age = document.getElementById('age').value;
	var minage = document.getElementById('minage').value;
	var country = document.getElementById('country').value;
	var milesfrom = document.getElementById('milesfrom').value;
	var cb_state = document.getElementById('cb_state').value;
	var cb_city = document.getElementById('cb_city').value;
	var queryString = "?sex=" + sex + "&age=" + age + "&minage=" + minage + "&country=" + country + "&milesfrom=" + milesfrom + "&cb_state=" + cb_state + "&cb_city=" + cb_city;
	ajaxRequest.open("GET", "/components/com_helloworld/search.php" + queryString, true);
	ajaxRequest.send(null); 
}

//-->
</script>

And here's my selects:

<table cellspacing='10' width='900'><tbody><tr><td valign='top'><p>
				</p><br />
				<p style="width:100px;">
				<form id="cbcheckedadminForm" name="adminForm">
				Gender: <select id='sex' onchange='ajaxFunction()' value='Query MySQL'/><br />
				<option selected value=''>No Preference</option>
				<option value='Male'>Male</option>
				<option value='Female'>Female</option>
				</select>
				<br /><br />
				Min Age: <select id='minage' onchange='ajaxFunction()' value='Query MySQL'/><br />
				<option selected value='15'>15</option>
				<option value='20'>20</option>
				<option value='30'>30</option>
				<option value='40'>40</option>
				<option value='50'>50</option>
				<option value='60'>60</option>
				<option value='70'>70</option>
				<option value='80'>80</option>
				<option value='90'>90</option>
				<option value='100'>100</option>
				</select><br />
				Max Age: <select id='age' onchange='ajaxFunction()' value='Query MySQL'/><br />
				<option value='20'>20</option>
				<option value='30'>30</option>
				<option value='40'>40</option>
				<option value='50'>50</option>
				<option value='60'>60</option>
				<option value='70'>70</option>
				<option value='80'>80</option>
				<option value='90'>90</option>
				<option selected value='100'>100</option>
				</select><br />
				<input type='hidden' onclick='ajaxFunction()' value='Query MySQL' />
				</p>
				<br /><br />
	Country: <select id='country' name='country' onchange='ajaxFunction()' value='Query MySQL' /><br />
	<option value="" selected="selected"></option>
	<option value="United States" id="cbf120304">United States</option> 
	<option value="Afghanistan" id="cbf120305">Afghanistan</option> 
	<!-- Shortened to fit on forum --> 
</select> 
<br />
<br />
<label for="cb_state">State:<input class="inputbox AND DEPENDS ON country BEING United States" type="hidden"/></label><label for="cb_caprovince">Province:<input class="DEPENDS ON country BEING Canada" type="hidden" /></label><label for="cb_state"> <select gtbfieldid="2676" name="cb_state" id="cb_state" style="width:175px;" onChange="ajaxFunction();handleOnChange(this);" class="inputbox" value='Query MySQL' /> <option onchange="clearFields()"><?php echo $state; ?></option>
<option value="Alabama" id="cbf85857">Alabama</option><!-- Shortened to fit on forum -->
 </select> 
<input class="inputbox AND DEPENDS ON country BEING United States" type="hidden" /></label><label for="cb_caprovince"> <select gtbfieldid="2677" name="cb_caprovince" id="cb_caprovince" class="inputbox" style="width:175px;" onchange='ajaxFunction()' value='Query MySQL' /> <option><?php echo $caprovince; ?></option> <option value="Alberta" id="cbf66426">Alberta</option> <option value="British Columbia" id="cbf66427">British Columbia</option> <option value="Manitoba" id="cbf66428">Manitoba</option> <option value="New Brunswick" id="cbf66429">New Brunswick</option> <option value="NewFoundland" id="cbf66430">NewFoundland</option> <option value="North West Territories" id="cbf66431">North West Territories</option> <option value="Nova Scotia" id="cbf66432">Nova Scotia</option> <option value="Nunavut" id="cbf66433">Nunavut</option> <option value="Ontario" id="cbf66434">Ontario</option> <option value="Prince Edward Island" id="cbf66435">Prince Edward Island</option> <option value="Quebec" id="cbf66436">Quebec</option> <option value="Saskatchewan" id="cbf66437">Saskatchewan</option> <option value="Yukon" id="cbf66438">Yukon</option> </select> 
<input class="DEPENDS ON country BEING Canada" type="hidden" /></label>
<br />

		<p><br /><label for="within">Within <input class="inputbox AND DEPENDS ON country BEING United States AND DEPENDS ON cb_state BEING Alabama OR cb_state BEING Alaska OR cb_state BEING Arizona OR cb_state BEING Arkansas OR cb_state BEING California OR cb_state BEING Colorado OR cb_state BEING Connecticut OR cb_state BEING Delaware OR cb_state BEING District of Columbia OR cb_state BEING Florida OR cb_state BEING Georgia OR cb_state BEING Hawaii OR cb_state BEING Idaho OR cb_state BEING Illinois OR cb_state BEING Indiana OR cb_state BEING Iowa OR cb_state BEING Kansas OR cb_state BEING Kentucky OR cb_state BEING Louisiana OR cb_state BEING Maine OR cb_state BEING Maryland OR cb_state BEING Massachusetts OR cb_state BEING Michigan OR cb_state BEING Minnesota OR cb_state BEING Mississippi OR cb_state BEING Missouri OR cb_state BEING Montana OR cb_state BEING Nebraska OR cb_state BEING Nevada OR cb_state BEING New Hampshire OR cb_state BEING New Jersey OR cb_state BEING New Mexico OR cb_state BEING New York OR cb_state BEING North Carolina OR cb_state BEING North Dakota OR cb_state BEING Ohio OR cb_state BEING Oklahoma OR cb_state BEING Oregon OR cb_state BEING Pennsylvania OR cb_state BEING Rhode Island OR cb_state BEING South Carolina OR cb_state BEING South Dakota OR cb_state BEING Tennessee OR cb_state BEING Texas OR cb_state BEING Utah OR cb_state BEING Vermont OR cb_state BEING Virginia OR cb_state BEING Washington OR cb_state BEING West Virginia OR cb_state BEING Wisconsin OR cb_state BEING Wyoming" type="hidden" /></label>
		<label for="within"><select name='milesfrom' id='milesfrom' class="inputbox AND DEPENDS ON country BEING United States AND DEPENDS ON cb_state BEING Alabama OR cb_state BEING Alaska OR cb_state BEING Arizona OR cb_state BEING Arkansas OR cb_state BEING California OR cb_state BEING Colorado OR cb_state BEING Connecticut OR cb_state BEING Delaware OR cb_state BEING District of Columbia OR cb_state BEING Florida OR cb_state BEING Georgia OR cb_state BEING Hawaii OR cb_state BEING Idaho OR cb_state BEING Illinois OR cb_state BEING Indiana OR cb_state BEING Iowa OR cb_state BEING Kansas OR cb_state BEING Kentucky OR cb_state BEING Louisiana OR cb_state BEING Maine OR cb_state BEING Maryland OR cb_state BEING Massachusetts OR cb_state BEING Michigan OR cb_state BEING Minnesota OR cb_state BEING Mississippi OR cb_state BEING Missouri OR cb_state BEING Montana OR cb_state BEING Nebraska OR cb_state BEING Nevada OR cb_state BEING New Hampshire OR cb_state BEING New Jersey OR cb_state BEING New Mexico OR cb_state BEING New York OR cb_state BEING North Carolina OR cb_state BEING North Dakota OR cb_state BEING Ohio OR cb_state BEING Oklahoma OR cb_state BEING Oregon OR cb_state BEING Pennsylvania OR cb_state BEING Rhode Island OR cb_state BEING South Carolina OR cb_state BEING South Dakota OR cb_state BEING Tennessee OR cb_state BEING Texas OR cb_state BEING Utah OR cb_state BEING Vermont OR cb_state BEING Virginia OR cb_state BEING Washington OR cb_state BEING West Virginia OR cb_state BEING Wisconsin OR cb_state BEING Wyoming" onchange='ajaxFunction()' value='Query MySQL'/>&nbsp;
		<option selected value='5'>5</option>
		<option value='10'>10</option>
		<option value='20'>20</option>
		<option value='30'>30</option>
		<option value='40'>40</option>
		<option value='50'>50</option>
		<option value='60'>60</option>
		<option value='70'>70</option>
		<option value='80'>80</option>
		<option value='90'>90</option>
		<option value='100'>100</option>
		</select>&nbsp;miles of </label>

<br /><label for="cb_city"><input class="inputbox AND DEPENDS ON country BEING United States AND DEPENDS ON cb_state BEING Alabama OR cb_state BEING Alaska OR cb_state BEING Arizona OR cb_state BEING Arkansas OR cb_state BEING California OR cb_state BEING Colorado OR cb_state BEING Connecticut OR cb_state BEING Delaware OR cb_state BEING District of Columbia OR cb_state BEING Florida OR cb_state BEING Georgia OR cb_state BEING Hawaii OR cb_state BEING Idaho OR cb_state BEING Illinois OR cb_state BEING Indiana OR cb_state BEING Iowa OR cb_state BEING Kansas OR cb_state BEING Kentucky OR cb_state BEING Louisiana OR cb_state BEING Maine OR cb_state BEING Maryland OR cb_state BEING Massachusetts OR cb_state BEING Michigan OR cb_state BEING Minnesota OR cb_state BEING Mississippi OR cb_state BEING Missouri OR cb_state BEING Montana OR cb_state BEING Nebraska OR cb_state BEING Nevada OR cb_state BEING New Hampshire OR cb_state BEING New Jersey OR cb_state BEING New Mexico OR cb_state BEING New York OR cb_state BEING North Carolina OR cb_state BEING North Dakota OR cb_state BEING Ohio OR cb_state BEING Oklahoma OR cb_state BEING Oregon OR cb_state BEING Pennsylvania OR cb_state BEING Rhode Island OR cb_state BEING South Carolina OR cb_state BEING South Dakota OR cb_state BEING Tennessee OR cb_state BEING Texas OR cb_state BEING Utah OR cb_state BEING Vermont OR cb_state BEING Virginia OR cb_state BEING Washington OR cb_state BEING West Virginia OR cb_state BEING Wisconsin OR cb_state BEING Wyoming" type="hidden" /></label><p></p>

	<label for="cb_city"><select name="cb_city" id="cb_city" class="inputbox" style="width:175px;" onchange='ajaxFunction()' value='Query MySQL' />
	<option value=""><?php echo $city; ?></option>
	</select>

<input class="inputbox1 AND DEPENDS ON country BEING United States AND DEPENDS ON cb_state BEING Alabama OR cb_state BEING Alaska OR cb_state BEING Arizona OR cb_state BEING Arkansas OR cb_state BEING California OR cb_state BEING Colorado OR cb_state BEING Connecticut OR cb_state BEING Delaware OR cb_state BEING District of Columbia OR cb_state BEING Florida OR cb_state BEING Georgia OR cb_state BEING Hawaii OR cb_state BEING Idaho OR cb_state BEING Illinois OR cb_state BEING Indiana OR cb_state BEING Iowa OR cb_state BEING Kansas OR cb_state BEING Kentucky OR cb_state BEING Louisiana OR cb_state BEING Maine OR cb_state BEING Maryland OR cb_state BEING Massachusetts OR cb_state BEING Michigan OR cb_state BEING Minnesota OR cb_state BEING Mississippi OR cb_state BEING Missouri OR cb_state BEING Montana OR cb_state BEING Nebraska OR cb_state BEING Nevada OR cb_state BEING New Hampshire OR cb_state BEING New Jersey OR cb_state BEING New Mexico OR cb_state BEING New York OR cb_state BEING North Carolina OR cb_state BEING North Dakota OR cb_state BEING Ohio OR cb_state BEING Oklahoma OR cb_state BEING Oregon OR cb_state BEING Pennsylvania OR cb_state BEING Rhode Island OR cb_state BEING South Carolina OR cb_state BEING South Dakota OR cb_state BEING Tennessee OR cb_state BEING Texas OR cb_state BEING Utah OR cb_state BEING Vermont OR cb_state BEING Virginia OR cb_state BEING Washington OR cb_state BEING West Virginia OR cb_state BEING Wisconsin OR cb_state BEING Wyoming" type="hidden" /></label>
<br />
<br />
</form>

				</td>
				<td valign="top"><div id="ajaxDiv" style="width:500px;"></div></td></tr></tbody></table>

I want to use checkboxes instead of selects for everything except min/max ages and miles from.

What's the best way to go about this? It seems using checkboxes with ajax is way more complicated than it should be lol.

[Basscyst]

Do you want the user to be able to select multiple items from each section? If not then you want to use a radio input type instead of a checkbox. Checkboxes allow for multiple items to be selected, while radios just allow one of the group. You can give all your radio buttons within a grouping the same name (id's will still be unique) and access the value or text of the one selected by accessing it by name on the post back.

To access the radio that is selected on the client side you can do something like:

document.forms.elements["radioname"].value

This will grab only the radio value of the selected element within the given groups name where as document.getElementByID will grab the radio with the corresponding id regardless of it being checked.

[sfraise]

I ended up getting it by using

	if (document.getElementById('sex1').checked) {
	var sex = document.getElementById('sex1').value; }
	if (document.getElementById('sex2').checked) {
	var sex = document.getElementById('sex2').value; }
	if (document.getElementById('sex3').checked) {
	var sex = document.getElementById('sex3').value; }