HELP with No Repeat Conditional Form Fields

Java noob here,

Trying to figure out whats the best way to go about this.

In my form I want user to Rate on a scale of 1-6 the importance of 6 questions that they have just answered.
How can I Select 1 - 6 from a dropdown but have each selection be conditional...so the same number can't be selected twice.
Any suggestions would be very much appreciated?

Below is a code snippet...





<table width="800" border="0" cellpadding="0">

<tr>
<td align="center"><span class="body_text">Question #1</span></td>
<td align="center"><span class="body_text">Question #2</span></td>
<td align="center"><span class="body_text">Question #3</span></td>
<td align="center"><span class="body_text">Question #4</span></td>
<td align="center"><span class="body_text">Question #5</span></td>
<td align="center"><span class="body_text">Question #6</span></td>
</tr>
<tr>
<td align="center">
<select name="question_importance1">
<option value="-">Ranking</option>
<option value="1">1 </option>
<option value="2">2 </option>
<option value="3">3 </option>
<option value="4">4 </option>
<option value="5">5 </option>
<option value="6">6 </option>
</select>
</td>
<td align="center">
<select name="question_importance2">
<option value="-">Ranking</option>
<option value="1">1 </option>
<option value="2">2 </option>
<option value="3">3 </option>
<option value="4">4 </option>
<option value="5">5 </option>
<option value="6">6 </option>
</select>
</td>
<td align="center">
<select name="question_importance3">
<option value="-">Ranking</option>
<option value="1">1 </option>
<option value="2">2 </option>
<option value="3">3 </option>
<option value="4">4 </option>
<option value="5">5 </option>
<option value="6">6 </option>
</select>
</td>

Four general approaches:

(1) Just wait until the user submits the form and then validate that there are no duplicate choices.

(2) As each question is ranked, remove that <option> from the other <select>s. (Probably better to change its color or something, so that if the user changes his/her mind it's easier to re-enable it.)

(3) Don't do it this way, at all. Instead, give the user a list of the 6 questions and let him/her drag/drop them into the order of importance. Doing a true drag/drop is a bit more work, but you should be able to find a JS library out there somewhere that will help you do it.

(4) A variation on (3) that is much simpler to do:
http://www.clearviewdesign.com/Newbie/Demos/jsDual.html
You would of course get rid of the >> and Show List buttons. You would use << as a "reset" to start over. The user just clicks on the items on left in order of preference and they are moved to the right. There's some crap code in there that was needed for MSIE 4 which I think we can ignore nowadays.

By the way, you are a JavaScript noob.

Java is a completely different language that has little in common with JavaScript except the name.

Another approach would be to use a matrix of radio buttons:-

<form name = "myform">
Question Importance Rank 1 &nbsp &nbsp
Q1<input type = "radio" name = "rad1" onclick = "checknodup()">
Q2<input type = "radio" name = "rad1" onclick = "checknodup()">
Q3<input type = "radio" name = "rad1" onclick = "checknodup()">
Q4<input type = "radio" name = "rad1" onclick = "checknodup()">
Q5<input type = "radio" name = "rad1" onclick = "checknodup()">
Q6<input type = "radio" name = "rad1" onclick = "checknodup()">


<br>
Question Importance Rank 2 &nbsp &nbsp
Q1<input type = "radio" name = "rad2" onclick = "checknodup()">
Q2<input type = "radio" name = "rad2" onclick = "checknodup()">
Q3<input type = "radio" name = "rad2" onclick = "checknodup()">
Q4<input type = "radio" name = "rad2" onclick = "checknodup()">
Q5<input type = "radio" name = "rad2" onclick = "checknodup()">
Q6<input type = "radio" name = "rad2" onclick = "checknodup()">

<br>
Question Importance Rank 3 &nbsp &nbsp
Q1<input type = "radio" name = "rad3" onclick = "checknodup()">
Q2<input type = "radio" name = "rad3" onclick = "checknodup()">
Q3<input type = "radio" name = "rad3" onclick = "checknodup()">
Q4<input type = "radio" name = "rad3" onclick = "checknodup()">
Q5<input type = "radio" name = "rad3" onclick = "checknodup()">
Q6<input type = "radio" name = "rad3" onclick = "checknodup()">


<script type = "text/javascript">
function checknodup() {

var rd1 = document.myform.rad1;
var rd2 = document.myform.rad2;
var rd3 = document.myform.rad3;

for (var i = 0; i<=5; i++) {
rd1[i].disabled = false;
rd2[i].disabled = false;
rd3[i].disabled = false;
}

for (var i=0; i<=5; i++) {
if (document.myform.rad1[i].checked) {
rd2[i].checked = false;
rd3[i].checked = false;
rd2[i].disabled = true;
rd3[i].disabled = true;
}

if (document.myform.rad2[i].checked) {
rd1[i].checked = false;
rd3[i].checked = false;
rd1[i].disabled = true;
rd3[i].disabled = true;
}

if (document.myform.rad3[i].checked) {
rd1[i].checked = false;
rd2[i].checked = false;
rd1[i].disabled = true;
rd2[i].disabled = true;
}
}

}


</script>



“I am so clever that sometimes I don't understand a single word of what I am saying.” - Oscar Wilde (Irish Poet, Novelist, Dramatist and Critic, 1854-1900)

Thanks for the quick responses Old Pedant and Philip M. I really appreciate it. Take Care!