#EANF#
Thanks for reviewing. I've found no fewer than 5 articles here and
reviewed all the tutorials on w3schools. There is no doubt in my mind that
this should be working, but alas it isn't. I need to dynamically add
options to a select box based upon a selection on a previous select box on
an HTML page. I'm using javascript because the wrapper for this page will
not support jquery. Here are requirements:
vent_pip must always start with an option having value "..." but blank
descriptor.
If selected option on vent select box is SIPAP, vent_pip should hold
values 4 thru 11 incrementing by 1.
If selected option on vent select box is Oscillator, vent_pip is not shown
and populating it is ignored.
If any other option is selected, vent_pip should hold values 12 through 30
incrementing by 2.
My javascript is properly populating the vent_pip select box with values
based upon selection from 'vent'.
THE PROBLEM: When the item in 'vent' is changed (ie picking CPAP first,
and then SIPAP) my javascript to wipe the values starting at position 1
(skipping '...' at position 0) from 'vent_pip' before adding new ones is
failing. Thus the 'vent_pip' select box will end up with something like
12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 4, 5, 6, 7, 8, 9, 10, 11.
Any help you can offer would be great. As I said I've tried to mimick
several of the posts here on SO as well as w3schools to no avail. Feel
free to link them but it's likely that I've already gone through. THANKS!
Pertinent function code:
var PIP = document.getElementById('vent_pip');
for(i=1;i<PIP.options.length-1;i++){
PIP.remove(i);
}
for(i=4;i<12;i++){
PIP.options[PIP.options.length] = new Option(i,i);
}
for(i=1;i<PIP.options.length-1;i++){
PIP.remove(i);
}
for(i=12;i<31;i++){
PIP.options[PIP.options.length] = new Option(i,i);
i++;
}
Larger Code block: (NOTE: This is not the entire file. I can provide it at
request.
<html>
<head>
<script type="text/javascript" language="javascript">
function showHide(sectionId,setting) {
document.getElementById(sectionId ).style.display = setting;
}
function checkSetting(vent){
var PIP = document.getElementById('vent_pip');
var i = 0;
if(document.getElementById(vent).value=="Oscillator"){
showHide('divOscSelect','block');
showHide('divNoOscSelect','none');
showHide('divSIPAPSelect','none');
showHide('divFiO2','block');
document.getElementById('cbx_vent').checked=true;
} else if(document.getElementById(vent).value=="SIPAP"){
showHide('divOscSelect','none');
showHide('divNoOscSelect','none');
showHide('divSIPAPSelect','block');
showHide('divFiO2','none');
for(i=1;i<PIP.options.length-1;i++){
PIP.remove(i);
}
for(i=4;i<12;i++){
PIP.options[PIP.options.length] = new Option(i,i);
}
document.getElementById('cbx_vent').checked=true;
} else {
showHide('divOscSelect','none');
showHide('divNoOscSelect','block');
showHide('divSIPAPSelect','block');
showHide('divFiO2','block');
for(i=1;i<PIP.options.length-1;i++){
PIP.remove(i);
}
for(i=12;i<31;i++){
PIP.options[PIP.options.length] = new Option(i,i);
i++;
}
document.getElementById('cbx_vent').checked=true;
}
if(document.getElementById(vent).value==""){
showHide('divOscSelect','none');
showHide('divNoOscSelect','none');
showHide('divSIPAPSelect','none');
showHide('divFiO2','none');
document.getElementById('cbx_vent').checked=false;
}
</script>
</head>
<body>
<form method="get" action="" name="common_admission">
<table width="100%">
<tr>
<td><input type="checkbox" name="cbx_vent" id="cbx_vent"
value="true"/>Ventilated Assistance</td>
</tr>
<tr>
<td width=145 valign="top" style="text-align:right">Mode:
</td>
<td>
<select name="vent" id="vent" onchange="checkSetting('vent');">
<option value=""></option>
<option value="Pressure Support Vent">PSV - Pressure Support
Vent</option>
<option value="Continuous Mandatory Vent">CMV - Continuous
Mandatory Vent</option>
<option value="Sync Intermittant Mandatory Vent">SIMV - Sync
Intermittant Mandatory Vent</option>
<option value="Assist Control Vent">AC - Assist Control Vent</option>
<option value="Cont Pos Air Pressure">CPAP - Cont Pos Air
Pressure</option>
<option value="Pressure Control Vent">Pressure Control Vent</option>
<option value="SIPAP">SIPAP</option>
<option value="Oscillator">Oscillator</option>
</select>
</td>
</tr>
</table>
<div id="divSIPAPSelect" style="display: none;">
<table width="100%">
<tr>
<td width="92%">PIP (cmH2O)
<select name="vent_pip" id="vent_pip">
<option value="..."></option>
</select>
</td>
</tr>
</table>
</form>
</body>
</html>
No comments:
Post a Comment