title: Using javascript to limit survey choices to three unique values
body: <p>I'm required to use a limited survey application, and have to adapt the provided code to meet more advanced functionality. </p>
  
  <p>I need to create a weighted ranking question, so users can select their top three choices and the data will go into the survey application and be accessible in the survey reports.  The application only supports 2 types of questions (text fill &amp; multiple choice) but I can alter the code, as long as it still sends the form data back to the survey application. </p>
  
  <p>The code is set up so it will show a drop-down menu of 0-3 for each option.  Now I want to limit the user's choices so they can only select one "1" "2" or "3", three choices total.  Ideally, if the user already had "2" selected for one option and they tried to select it for another option, it would set the first "2" as "0" or blank.  </p>
  
  <p>Is this possible to do with javascript?  If so, does anyone know of a site that might show code like this, or provide similar enough examples that I could adapt it?</p>
  
  <p>Current code here: </p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;&lt;title&gt;Survey&lt;/title&gt;&lt;/head&gt;
  &lt;!-- Changes
  - remove br to put dropdown next to text for each item.  Switch text &amp; dropdown order    
  for each item.
  - add comments to separate each question
  - removed blue title font
  - add instructions
  
  Goals
  - limit choices to one 1 one 2 and one 3, three choices total.
  --&gt;
  &lt;link href="---" rel="stylesheet" type="text/css"&gt;
  &lt;body bgcolor="#3c76a3"&gt;
  
  &lt;!-- TRANSITIONAL DIALOG BOX --&gt;
  &lt;table border="0" align="center" cellpadding="0" cellspacing="0" style="background-attachment: scroll; background-color: #3c76a3; background-repeat: no-repeat; background-position: left top;" bgcolor="#3c76a3" topmargin="0" marginwidth="0" marginheight="0" width="100%" height="100%"&gt;
  &lt;tr&gt;
  &lt;td&gt;
  &lt;table border="0" align="center" cellpadding="0" cellspacing="0" id="survey"&gt;
  &lt;tr&gt;
  
  &lt;td&gt;&lt;p&gt;&amp;nbsp;&lt;/p&gt;
  
  &lt;!-- HEADER END --&gt;
  &lt;!-- FORM START TAG --&gt;&lt;form name="survey" action="---" method="POST"&gt;
  &lt;FONT face="Verdana, Arial, Helvetica, sans-serif"&gt;
  &lt;b&gt;survey&lt;/b&gt;&lt;hr&gt;
  
  &lt;!-- 1 --&gt;
  &lt;input type=hidden name="Buy R.J. a DeLorean_multiple_answers" value="one"&gt;
  &lt;font size=2&gt;&lt;select name="Buy R.J. a DeLorean" SIZE=1&gt;
  &lt;option value=""&gt;
  &lt;option value="0"&gt;0
  &lt;option value="1"&gt;1
  &lt;option value="2"&gt;2
  &lt;option value="3"&gt;3
  &lt;/select&gt;&lt;/font&gt;
  &lt;input type="hidden" name="Buy R.J. a DeLorean_help" value=""&gt;
  &lt;b&gt;&lt;font size=2&gt;Buy R.J. a DeLorean&lt;/font&gt;&lt;/b&gt;
  &lt;hr size=1&gt;
  
  &lt;!-- 2 --&gt;
  &lt;input type=hidden name="Fill Lisa's office with marshmallows._multiple_answers"     value="one"&gt;
  &lt;font size=2&gt;&lt;select name="Fill Lisa's office with marshmallows." SIZE=1&gt;
  &lt;option value=""&gt;
  &lt;option value="0"&gt;0
  &lt;option value="1"&gt;1
  &lt;option value="2"&gt;2
  &lt;option value="3"&gt;3
  &lt;/select&gt;&lt;/font&gt;
  &lt;input type="hidden" name="Fill Lisa's office with marshmallows._help" value=""&gt;
  &lt;b&gt;&lt;font size=2&gt;Fill Lisa's office with marshmallows.&lt;/font&gt;&lt;/b&gt;
  &lt;hr size=1&gt;
  
  &lt;!-- 3 --&gt;
  &lt;input type=hidden name="Install a beer fridge in everyone's filing     cabinets._multiple_answers" value="one"&gt;
  &lt;font size=2&gt;&lt;select name="Install a beer fridge in everyone's filing cabinets." SIZE=1&gt;
  &lt;option value=""&gt;
  &lt;option value="0"&gt;0
  &lt;option value="1"&gt;1
  &lt;option value="2"&gt;2
  &lt;option value="3"&gt;3
  &lt;/select&gt;&lt;/font&gt;
  &lt;input type="hidden" name="Install a beer fridge in everyone's filing cabinets._help" value=""&gt;
  &lt;b&gt;&lt;font size=2&gt;Install a beer fridge in everyone's filing cabinets.&lt;/font&gt;&lt;/b&gt;
  &lt;hr size=1&gt;
  
  &lt;!-- 4 --&gt;
  &lt;input type=hidden name="Buy a company Cessna_multiple_answers" value="one"&gt;
  &lt;font size=2&gt;&lt;select name="Buy a company Cessna" SIZE=1&gt;
  &lt;option value=""&gt;
  &lt;option value="0"&gt;0
  &lt;option value="1"&gt;1
  &lt;option value="2"&gt;2
  &lt;option value="3"&gt;3
  &lt;/select&gt;&lt;/font&gt;
  &lt;input type="hidden" name="Buy a company Cessna_help" value=""&gt;
  &lt;b&gt;&lt;font size=2&gt;Buy a company Cessna&lt;/font&gt;&lt;/b&gt;&lt;br&gt;
  &lt;hr size=1&gt;
  
  &lt;!-- 5 --&gt;
  &lt;input type=hidden name="Replace Conf2's chairs with miniature ponies._multiple_answers" value="one"&gt;
  &lt;font size=2&gt;&lt;select name="Replace Conf2's chairs with miniature ponies." SIZE=1&gt;
  &lt;option value=""&gt;
  &lt;option value="0"&gt;0
  &lt;option value="1"&gt;1
  &lt;option value="2"&gt;2
  &lt;option value="3"&gt;3
  &lt;/select&gt;&lt;/font&gt;
  &lt;input type="hidden" name="Replace Conf2's chairs with miniature ponies._help" value=""&gt;
  &lt;b&gt;&lt;font size=2&gt;Replace Conf2's chairs with miniature ponies.&lt;/font&gt;&lt;/b&gt;
  &lt;hr size=1&gt;
  
  &lt;input type="hidden" name="question_names" value="{Buy R.J. a DeLorean} {Fill Lisa's office with marshmallows.} {Install a beer fridge in everyone's filing cabinets.} {Buy a company Cessna} {Replace Conf2's chairs with miniature ponies.}"&gt;
  &lt;p align="right"&gt;&lt;input type="image" BORDER=0 title="Save Changes" alt="Save Changes" src="---"  name="button_save_changes"&gt;
  &lt;input type="hidden" name="showconfirm" value="T"&gt;
  &lt;input type="hidden" name="showresults" value="F"&gt;
  &lt;input type="hidden" name="preventdupesmemberid" value="T"&gt;
  &lt;input type="hidden" name="preventdupesip" value="F"&gt;
  &lt;input type="hidden" name="numberquestions" value="F"&gt;
  &lt;input type="hidden" name="destinationurl" value=""&gt;
  &lt;input type="hidden" name="original_survey_id" value="62"&gt;
  &lt;!-- FORM END TAG --&gt;&lt;/form&gt;
  &lt;!-- FOOTER START --&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;!-- END HEADER --&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>