asked on

Easy onselect question

Offering 30 points because that's all I have. :(

My problem is I need to display a text box (Start Date) if the user selects any item from a drop down list (Frequencies) other then Once.

This is for a Standing Orders/Remote Order Entry application that when the user is placing an order (Medical) and they would like the patient to be drawn more then once (Standing Order) they then need to provide a Start date as well. By default I don't want the start date to be shown because how my layout is, it would confuse many people.

Here is the code I have so far, although there has to be a way to automate this, I have 30 test slots that would all need to potentially use this script:

function showDate(freq1)
{
if (document.update.freq1.value!="Once")
document.getElementById('TZTStartDate1').style.visibility = "visible";
else
document.getElementById('TZTStartDate1').style.visibility = "hidden";
}

function showDate(freq2)
{
if (document.update.freq2.value!="Once")
document.getElementById('TZTStartDate2').style.visibility = "visible";
else
document.getElementById('TZTStartDate2').style.visibility = "hidden";
}

etc.. for all 30 tests.. I know I know there HAS to be an easy way to script this.

<tr bgcolor="ffffff">
<td><input type="hidden" name="test1" value="COMPLETE BLOOD COUNT (CBC)">COMPLETE BLOOD COUNT (CBC)</td>
<td><select name="test11dx" class="small_black"><option value="1" selected>1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="test12dx" class="small_black"><option value=""><option value="1">1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="test13dx" class="small_black"><option value=""><option value="1">1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="test14dx" class="small_black"><option value=""><option value="1">1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="freq1" class="small_black" onchange="javascript:showDate(freq1)"><option value="Once">Once<option value="Weekly">Weekly<option value="Daily">Daily<option value="Random">Random<option value="Mon&Thur">Mon & Thurs<option value="Annual">Annual<option value="BiWeekly">BiWeekly<option value="Quarterly">Quarterly<option value="SemiAnnual">SemiAnnual<option value="3Weeks">3 Weeks<option value="4Months">4 Months<option value="BIMONTHLY">BiMonthly</select></td>
<td><font id="TZTStartDate1" style="visibility:hidden"><input type="text" name="TZTStartDate1" class="cellbox" size="10" onFocus="javascript:vDateType='1'" onKeyUp="DateFormat(this,this.value,event,false,'1')" onBlur="DateFormat(this,this.value,event,true,'1')"><img align="bottom" src="/images/cal.jpg" border="0" onclick="javascript:showCal('TZTStartDate1')"></font></td>
<td><input type="text" name="TZTStopDate1" class="cellbox" size="10" onFocus="javascript:vDateType='1'" onKeyUp="DateFormat(this,this.value,event,false,'1')" onBlur="DateFormat(this,this.value,event,true,'1')"><img align="bottom" src="/images/cal.jpg" border="0" onclick="javascript:showCal('TZTStopDate1')"></td>
</tr>

<tr bgcolor="ffffff">
<td><input type="hidden" name="test2" value="HEPATIC FUNCTION PANEL">HEPATIC FUNCTION PANEL</td>
<td><select name="test21dx" class="small_black"><option value="1" selected>1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="test22dx" class="small_black"><option value=""><option value="1">1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="test23dx" class="small_black"><option value=""><option value="1">1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="test24dx" class="small_black"><option value=""><option value="1">1<option value="2">2<option value="3">3<option value="4">4</select></td>
<td><select name="freq2" class="small_black" onchange="javascript:showDate(freq2)"><option value="Once">Once<option value="Weekly">Weekly<option value="Daily">Daily<option value="Random">Random<option value="Mon&Thur">Mon&Thurs<option value="Annual">Annual<option value="BiWeekly">BiWeekly<option value="Quarterly">Quarterly<option value="SemiAnnual">SemiAnnual<option value="3Weeks">3 Weeks<option value="4Months">4 Months<option value="BIMONTHLY">BiMonthly</select></td>
<td><font id="TZTStartDate2" style="visibility:hidden"><input type="text" name="TZTStartDate2" class="cellbox" size="10" onFocus="javascript:vDateType='1'" onKeyUp="DateFormat(this,this.value,event,false,'1')" onBlur="DateFormat(this,this.value,event,true,'1')"><img align="bottom" src="/images/cal.jpg" border="0" onclick="javascript:showCal('TZTStartDate2')"></font></td>
<td><input type="text" name="TZTStopDate2" class="cellbox" size="10" onFocus="javascript:vDateType='1'" onKeyUp="DateFormat(this,this.value,event,false,'1')" onBlur="DateFormat(this,this.value,event,true,'1')"><img align="bottom" src="/images/cal.jpg" border="0" onclick="javascript:showCal('TZTStopDate2')"></td>
</tr>

etc..

Please please help!

cwolves

something like this:

var s0 = document.getElementById('Select Box #1');
var s1 = document.getElementById('Select Box #2');
var s2 = document.getElementById('Select Box #3');
var s3 = document.getElementById('Select Box #4');

var boxes = 4;

function CheckDupes(){
      var out = '|';
      for(var i=0; i<boxes; i++){
            t = eval('s'+i);
            if(out.indexOf('|'+t[t.selectedIndex].value+'|')>=0){
                  alert('Duplicate');
                  return false;
            }
            out+=t[t.selectedIndex].value+'|';      // | is a seperator.
      }
      return true;
}

ASKER CERTIFIED SOLUTION

Lucky48390

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

campbelc

ASKER

Works like a champ!