Jump to content

Java Script Validation for Select box


Recommended Posts

I have this dependent radio and dropdown box, it works fine. 
Now I am trying to validate and its failing to validate. When i click on a radio button it should display "select a make" and If i dont select anything it should prompt me to select something rather than just submit. Also when i try to reset, what ever ive selected does not clear away.

Any help will be great. Thanks in advance.


Original code is from http://forums.phpfreaks.com/topic/145947-radio-button-to-change-drop-down-fields/



<form id="formname" name="formname" method="post" action="#"  onsubmit="return validate()">
<input type="radio" name="make" value="Chrysler" onclick="changeMake(this.value);"> Chrysler<br />
<input type="radio" name="make" value="Ford" onclick="changeMake(this.value);"> Ford<br />
<input type="radio" name="make" value="GMC" onclick="changeMake(this.value);"> GMC<br />
<select name="model" id="model" onchange="changeModel(this.value);" disabled="disabled">
<option> -- Select a Make -- </option>
Output: <span id="output"></span>
<input type="reset">
<input type="submit"> 

<script type="text/javascript">

var models = new Array();
models['Chrysler'] = ['Pacifica', 'PT Cruiser', 'Sebring'];
models['Ford'] = ['Ranger', 'Taurus', 'Mustang'];
models['GMC'] = ['Acadia', 'Sierra', 'Yukon'];

function changeMake(make)
    var modelList = models[make];

    changeSelect('model', modelList, modelList);
    document.getElementById('model').disabled = false;

function changeModel(modelValue)
    document.getElementById('output').innerHTML = modelValue;

function changeSelect(fieldID, newValues, newOptions)
  selectField = document.getElementById(fieldID);
  selectField.options.length = 0;

  if (newValues && newOptions)
    for (i=0; i<newValues.length; i++)
      selectField.options[selectField.length] = new Option(newOptions[i], newValues[i]);


Link to comment
Share on other sites


This topic is now archived and is closed to further replies.

  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.