PDA

View Full Version : Help with JavaScript and Selectboxes


Wobbler
03-30-2006, 03:09 PM
I have 5 selectboxes on my page with several options each (the value for each option is X where X is the id-number of the errend, wich I get from a database).

What I want to do is when you make a selection in one of the selectboxes the selectboxes gets disabled and two other buttons (which are disabled on page load) gets enabled.
Button 1 = Reset Selection & Button 2 = Launch errend in popup.

When you press button 1, button 1 & button 2 gets disabled and the 5 selectboxes gets enabled.

When you press button 2 it launches a popup with the QueryString "xxxx.htm?id=X" and button 1 & button 2 gets disabled and the 5 selectboxes gets enabled.

You are only allowed to make ONE selection total in all the selectboxes

Best regards
// Robert

ecnarongi
03-30-2006, 10:09 PM
<html>
<head>
<script language="javascript">
function close_Me()
{
document.getElementById('sel1').disabled = true;
document.getElementById('sel2').disabled = true;
document.getElementById('sel3').disabled = true;
document.getElementById('sel4').disabled = true;
document.getElementById('sel5').disabled = true;

document.getElementById('reset').disabled = false;
document.getElementById('submit').disabled = false;
}

function reset_Me()
{
document.getElementById('sel1').disabled = false;
document.getElementById('sel2').disabled = false;
document.getElementById('sel3').disabled = false;
document.getElementById('sel4').disabled = false;
document.getElementById('sel5').disabled = false;


document.getElementById('reset').disabled = true;
document.getElementById('submit').disabled = true;
}

function submit_Me()
{
var q_string;
// do your check to see which selectbox is not equal to nil and instead of 'sel1' you used a varibable conresponding to the id of the selectbox that you need. you need to check all 5 selectboxes.
if (document.getElementById('sel1').options.selectedIndex != 0 )
{ q_string = "http://www.yahoo.com?id="+document.getElementById('sel1').value }

window.open(q_string);

reset_Me();
}
</script>
</head>

<body>
<form>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<select id="sel1" onchange="close_Me()">
<option value="1">Ice cream for sale</option>
<option value="2">Books for sale</option>
<option value="3">Tooth paste for sale</option>
</select>
</td>
<td>
<select id="sel2">
<option>Ice cream for sale</option>
<option>Books for sale</option>
<option>Tooth paste for sale</option>
</select>
</td>
<td>
<select id="sel3">
<option>Ice cream for sale</option>
<option>Books for sale</option>
<option>Tooth paste for sale</option>
</select>
</td>
<td>
<select id="sel4">
<option>Ice cream for sale</option>
<option>Books for sale</option>
<option>Tooth paste for sale</option>
</select>
</td>
<td>
<select id="sel5">
<option>Ice cream for sale</option>
<option>Books for sale</option>
<option>Tooth paste for sale</option>
</select>
</td>
</tr>
<tr><td colspan="5">&nbsp;</td></tr>
<tr>
<td><input type="button" id="reset" value="Reset" onclick="reset_Me()" disabled="disabled"/></td>
<td><input type="button" id="submit" value="Submit" onclick="submit_Me()" disabled="disabled"/></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
</form>
</body>
</html>


sorry if sloppy I had 15 mins left at work thought I'd help you out. if this is not what you want please explain what I did wrong.

Wobbler
03-30-2006, 10:30 PM
Almost there.

But when you choose an option in one box and the disable-select-boxes-script executes it should leave the option in the selectbox that was used as is and refresh the other boxes to their default option (Ex. <option value="#">Select errend nr</option>)
Is that possible?

Best regards
Robert

ecnarongi
03-31-2006, 02:56 PM
all you would have to do then is, send the id in the onchange function; modify the existing function so that if not the id sent set the selectindex to 0 for all selectboxes.