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!
LVL 6
campbelcAsked:
Who is Participating?
 
Lucky48390Commented:
Try using this script:
function showDate(updateFld, showFld)
     {
        document.getElementById(showFld).style.visibility = (document.getElementById(updateFld).value != "Once") ? "visible" : "hidden";
      }

Pass the variables in your code like so:
<select name="freq1" class="small_black" onchange='javascript:showDate(this.name, "TZTStartDate1")'>

that should be a decent start
0
 
cwolvesCommented:
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;
}
0
 
campbelcAuthor Commented:
Works like a champ!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.