Cold Fusion Tips-N-Tricks
Javascript: Checking to see if multi-dropdown selection boxes have a selection

This function comes in handy if you have multiple required multi-selection boxes and you want to easily check to see if the user has selected a value.



Example HTML/CFML code:
<script language="Javascript">

// Pass in a list of drop down fields that must have an item selected (will return false if none are)
// Example: if (!ValidateMultipleDropDown(document.ServiceForm,'ChannelCodeDesc|UserLevel','Channel Code|User Level')) return false;
function ValidateMultipleDropDown(thisform,Fields,Desc)
{
	var tmpVal='';
	var FieldArray=new Array();
	var DescArray=new Array();
	var tmp=0;
	var idx=0;
	// Create array for Field list
	tmpVal=Fields;
	do
	{
		tmp=tmpVal.indexOf('|');
		if (tmp == -1)
		{
			if (tmpVal != '')
			{
				FieldArray[FieldArray.length]=tmpVal;
				tmpVal='';
			}
		} else {
			FieldArray[FieldArray.length]=tmpVal.substring(0,tmp);
			tmpVal=tmpVal.substring(tmp + 1);
		}
	}
	while (tmpVal != '');
	// Create array for Desc list
	tmpVal=Desc;
	do
	{
		tmp=tmpVal.indexOf('|');
		if (tmp == -1)
		{
			if (tmpVal != '')
			{
				DescArray[DescArray.length]=tmpVal;
				tmpVal='';
			}
		} else {
			DescArray[DescArray.length]=tmpVal.substring(0,tmp);
			tmpVal=tmpVal.substring(tmp + 1);
		}
	}
	while (tmpVal != '');
	// Check to see if passed strings are of equal length
	if (FieldArray.length != DescArray.length)
	{
		alert('Fatal error: ValidateMultipleDropDown - Passed lists do not have the same length');
		return false;
	}
	// Validate fields
	for (i=0; i<FieldArray.length;i++)
	{
		tmp=0;
		eval('L=thisform.' + FieldArray[i] + '.length');
		for (x=0; x<L; x++)
		{
			eval('idx=thisform.' + FieldArray[i] + '.options[' + x + '].selected');
			if (idx == true) tmp++;
		}
		if (tmp == 0)
		{
			alert('Please select an item for ' + DescArray[i] + '.');
			return false;
		}
	}
	return true;
}

function SubmitForm()
{
	if (!ValidateMultipleDropDown(document.Test,'CellFeatures','Cell Features')) return false;

	alert('All is okay!');
}
</script>

<form name="Test">
Select the cell phone features you want:<br>
<select name="CellFeatures" size="7">
	<option>Automatic Pizza finder</option>
	<option>Belt clip with built-in yellow sticky pad, PostIt</option>
	<option>Headset with an super long cord</option>
	<option>Mother-in-law mute button</option>
	<option>Mother-in-law call blocking</option>
	<option>Three dozen face plates for every mood</option>
	<option>Wireless Web</option>
</select>
<br><br>
<input type="Button" value="Go!" onClick="SubmitForm()">
</form>


Return to the Cold Fusion Tips-N-Tricks topic list