1. Home
  2. Forums Index
  3. Browser Side / JavaScript and AJAX 8:09 pm May 13, 2026

Forum Moderators: open

Message Too Old, No Replies

selbox.options or another way?

Need to use a selbox option to are a question

         

roamin_oz

12:47 pm on Apr 16, 2012 (gmt 0)

10+ Year Member



My question:
I need to be able to have a "question" area (above the submit) but instead it being a dropdown box, I would like it just to be plain text within a table cell.

For example: when you select "Bob" in the name dropdown box I've configured the question area to ask a question. As Bob only has one leg would it be wise to place Bob in Football? Which is good, that is what I want it to do, but when selecting a sport for him it disappears (not good I want it to stay there).

Same happens when selecting Fred, Fred has no arms, no arms would not be good for Tennis etc... But when selecting Sam, no questions are asked because Sam has the ability to play all sports.

I have my options form submit to just do the name and the sport, I have that correct so no hassles there.

Just need to keep the question area active all the time (when applicable) but also instead of in a dropdown box be placed as text within a table cell.

Would using selbox.options be the best idea or should I try out something else? I need the Name & Sport selbox options dropdown boxes.

Cheers Mark 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<script type="text/javascript">
function setOptions(chosen, selbox) {

selbox.options.length = 0;
if (chosen == " ") {
 selbox.options[selbox.options.length] = new Option('Select Your Sport',' ');
setTimeout(setOptions('Blank',document.myform.optthree),5);
}
if (chosen == "1") {
 selbox.options[selbox.options.length] = new Option('Football','Bob - Football');
 selbox.options[selbox.options.length] = new Option('Hockey','Bob - Hockey');
 selbox.options[selbox.options.length] = new Option('Tennis','Bob - Tennis');
setTimeout(setOptions('Bob',document.myform.optthree),5);
}
if (chosen == "2") {
 selbox.options[selbox.options.length] = new Option('Football','Fred - Football');
 selbox.options[selbox.options.length] = new Option('Hockey','Fred - Hockey');
 selbox.options[selbox.options.length] = new Option('Tennis','Fred - Tennis');
setTimeout(setOptions('Fred',document.myform.optthree),5);
}
if (chosen == "3") {
 selbox.options[selbox.options.length] = new Option('Football','Sam - Football');
 selbox.options[selbox.options.length] = new Option('Hockey','Sam - Hockey');
 selbox.options[selbox.options.length] = new Option('Tennis','Sam - Tennis');
setTimeout(setOptions('Sam',document.myform.optthree),5);
}
if (chosen == "Bob") {
 selbox.options[selbox.options.length] = new Option('Bob Only Has One Leg, Would Football Be A Wise Choice?',' ');
}
if (chosen == "Fred") {
 selbox.options[selbox.options.length] = new Option('Fred Has No Arms, Would Tennis Be A Wise Choice?',' ');
}
if (chosen == "Sam") {
}
}
</script>
<BODY>
<TABLE>
<TD Width="300"><BR><form name="myform">
<select name="optone" size="1" onchange="setOptions(document.myform.optone.options[document.myform.optone.selectedIndex].value,document.myform.opttwo);">
<option value=" " selected="selected">Select Your Name</option>
<option value="1">Bob</option>
<option value="2">Fred</option>
<option value="3">Sam</option>
</select>

<select name="opttwo" size="1" onchange="setOptions(document.myform.opttwo.options[document.myform.opttwo.selectedIndex].value,document.myform.optthree);">
<option value=" " selected="selected">Select Your Sport</option>
</select></td><td>

<select name="optthree" size="1">
<option value=" " selected="selected">Question</option>
</select></td><tr><td></td><td align=center>

<input type="button" name="go" value="Value Selected" onclick="alert(document.myform.opttwo.options[document.myform.opttwo.selectedIndex].value);" />
</form>
</TD>
</TABLE>

<TABLE><TD WIDTH="600"><BR><BR><B>My question:</B><BR>
I need to be able to have a "question" area (above the submit) but instead it being a dropdown box, I would like it just to be plain text within a table cell.<BR><BR>For example: when you select "Bob" in the name dropdown box I've configured the question area to ask a question. As Bob only has one leg would it be wise to place Bob in Football? Which is good, that is what I want it to do, but when selecting a sport for him it disappears (not good I want it to stay there).<BR><BR>Same happens when selecting Fred, Fred has no arms, no arms would not be good for Tennis etc... But when selecting Sam, no questions are asked because Sam has the ability to play all sports.<BR><BR>I have my options form submit to just do the name and the sport, I have that correct so no hassles there.<BR><BR>Just need to keep the question area active all the time (when applicable) but also instead of in a dropdown box be placed as text within a table cell.

</BODY></HTML>

daveVk

6:58 am on Apr 17, 2012 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Maybe

<select name="optthree" size="1">
<option value=" " selected="selected">Question</option>
</select>

should be

<span id='question'></span>

and

selbox.options[selbox.options.length] = new Option('Fred Has No Arms, Would Tennis Be A Wise Choice?',' ');

become

document.getElementById('question').innerHTML = 'Fred Has No Arms, Would Tennis Be A Wise Choice?';

roamin_oz

12:43 pm on Apr 17, 2012 (gmt 0)

10+ Year Member



Hi Dave,

Thanks for your reply.

I've changed the 2 ideas from you into the code but nothing seems to happen. Do I need to add anything else to the code like another script to write to the span area?

I'm not sure if I'm making sense as I am normally a copy paste use a code that works for me person.

Cheers Mark

Fotiman

1:44 pm on Apr 17, 2012 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



First, your HTML is invalid. You've got a form that is opened in one table cell and closed in another (can't do that... wrap the entire table in the form tag instead). The first thing you should do is clean up the validation errors. [validator.w3.org...]

Next, I would look more closely at your logic. It seems as though you're trying to do too much with a single function. For example, the first select box is where you pick the person only. The second is where you pick the sport only. Yet you're trying to use a single function to handle both cases, which just over complicates the problem.

roamin_oz

12:25 am on Apr 18, 2012 (gmt 0)

10+ Year Member



Hi Fotiman

Personally I'm surprised I only have that many errors I thought it would be more. But thank you for your direction pushing to help me out.

I currently have a submit page with the two select box. The page is in use for a football last man standing competition. The players (about 120 currently left) selects his or hers name to which the 2nd box populates with the "remaining" selectable teams. Each time they player selects a team it is removed for selection in the next round. Problem is this year 2 extra teams have been included in the team line up. Obviously these teams have no where near the experience as the other teams so are more than likely to be defeated. So I've made a rule where you can only select opposite teams against the inexperienced teams a total of 4 times.

This is where the "question" area comes into play. Once a player selects the 4 teams, the future rounds where the inexperienced teams play the better teams are "blocked" from selection but I still want them displayed. I've currently made the selbox selection blocked out using a red background and red text, to which where the answer textarea would says:

Note: Selecting blocked teams in RED, will result in first eligible alphabetical team being selected.

I could just have the "note" there all the time, but I only want it to be displayed when a person who it applies to selects their name.

Do you have an idea on how I could make this happen?

Cheers Mark

Fotiman

2:09 pm on Apr 18, 2012 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Ok, so I would start by breaking down the logic:

Event: Players selects his/her name
Event Handler: Remaining selectable teams is populated. If the selected name has already chosen 4 teams opposite an inexperienced team, then display notice.

In my opinion, a better UI would prevent the user from having those teams as options. In other words, instead of listing those blocked teams along with the other teams, pull them out of the list and display those separately. For example:

Event: Players selects his/her name
Event Handler: Remaining selectable teams is populated. If the selected name has already chosen 4 teams opposite an inexperienced team, then remove blocked teams from the list, and display them separately with a message that they can't be selected.

roamin_oz

12:42 am on Apr 19, 2012 (gmt 0)

10+ Year Member



I've toyed with that idea myself, remove the teams that are the block all together from the list, so they are not possible to pick.

But in doing that, the question still remains on how when the "Event" is selected that an automatic message pops up to say

"insert player name here": "insert Team 1" and "insert Team 2" have been blocked/removed from selection as you have meet your quota. etc..

just for that person to know why they are not pick able.

The function would need to be like

if ( player1 is selected, display "player1 message" in blocked textarea box or leave blank)

if ( player15 is selected, display "player15 message" in blocked textarea box or leave blank)

if ( player61 is selected, display "player61 message" in blocked textarea box or leave blank)

For all the relevant players that have blocked teams for that round.

I personally thought this was a bit messy, so I went with the red highlighted background/text to "supposedly" block them and then just have the 1 message for all players: Red Boxes means blah blah blah.

Mark
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

  1. Home
  2. Forums Index
  3. Browser Side / JavaScript and AJAX 8:09 pm May 13, 2026