Updating rhw value of a form field according to other fields.

Discussion in 'JavaScript' started by mpace030, Apr 1, 2007.

  1. #1
    Hi guys!
    I need some help here, I'm a disaster in JS and I believe this is easy.

    I need to populate the VALUE for the input field OUTBOUND and INBOUND (on the bottom) according to the value on the dropdown startDate and endDate(on the JavaScript) using format 2007-03-31.



    <script>

    <!-- Begin By Answering The Following Questions //;

    // IF THERE IS MORE THAN ONE FORM, WHAT IS THE NAME OF YOUR FORM? //;
    var FORM = '0';

    // HOW MANY OPTION YEARS WOULD YOU LIKE TO DISPLAY? //;
    var YEARS = '2';

    // WOULD YOU LIKE TO DISPLAY PREVIOUS YEARS? YES : NO //;
    var PREVIOUS = 'NO';

    // WOULD YOU LIKE THE OPTION MENU'S TO LOAD AND DISPLAY THE CURRENT DATE? YES : NO //;
    var DISPLAY = 'YES';

    // WOULD YOU LIKE TO UPDATE THE END DATE WHENEVER THE START DATE IS CHANGED? YES : NO //;
    var UPDATE = 'YES';


    //###########################################################################//;
    //################### #################//;
    //################### NO NEED TO EDIT BEYOND THIS POINT #################//;
    //################### #################//;
    //################### SCRIPT AUTHOR: Willy Duitt #################//;
    //################### EMAIL: WillyDuitt@hotmail.com #################//;
    //################### #################//;
    //################### THIS SCRIPT MAY BE FREELY USED AS #################//;
    //################### LONG AS THESE CREDITS REMAIN INTACT #################//;
    //################### #################//;
    //###########################################################################//;

    // GET TODAYS DATE //;
    var today = new Date();
    var thisDay = today.getDate();
    var thisMonth = today.getMonth();
    var thisYear = today.getYear();
    if(thisYear<2000){thisYear += 1900};


    // FUNCTION TO ACCOUNT FOR DAYS IN MONTHES & LEAP YEAR //;
    function setMonth(theMonth,theYear){
    var numDays = 31;
    if(theMonth=='Apr'||theMonth=='Jun'||theMonth=='Sep'||theMonth=='Nov'){
    numDays = 30;
    }
    if(theMonth == 'Feb' && (theYear/4) == Math.floor(theYear/4)){
    numDays = 29;
    }
    if(theMonth == 'Feb' && (theYear/4) != Math.floor(theYear/4)){
    numDays = 28;
    }
    return numDays;
    }


    // FUNCTION TO CHANGE NUMBER OF DAYS IN MONTHS //;
    function setDays(select){
    var form = document.forms[FORM];
    var selYear = form[select+'Year'];
    var selMonth = form[select+'Month'];
    var selDay = form[select+'Day'];
    var theYear = selYear[selYear.selectedIndex].text;
    var theMonth = selMonth[selMonth.selectedIndex].text;
    var numDays = setMonth(theMonth,theYear);
    var theDays = selDay.length;

    if(theDays > numDays){
    for (var i=0; i<(theDays-numDays); i++){
    selDay.options[selDay.options.length-1] = null
    }
    }

    if(numDays > theDays){
    for(var i=0; i<(numDays-theDays); i++){
    newOption = new Option(selDay.options.length+1);
    selDay.add(newOption);
    }
    }
    }


    // FUNCTION TO WRITE DAYS OPTION MENU //;
    function writeDays(){
    var optDays = '';
    for(var day=1; day<=31; day++){
    optDays += '<OPTION value="'+day+'">';
    optDays += day+'</OPTION>';
    }
    return optDays;
    }


    // FUNCTION TO WRITE MONTHES OPTION MENU //;
    function writeMonthes(){
    var optMonthes = '';
    var theMonthes = new Array('Jan','Feb','Mar','Apr','May','Jun',
    'Jul','Aug','Sep','Oct','Nov','Dec');
    for(var month=0; month<theMonthes.length; month++){
    optMonthes += '<OPTION value="'+theMonthes[month]+'">';
    optMonthes += theMonthes[month]+'</OPTION>';
    }
    return optMonthes;
    }


    // FUNCTION TO WRITE YEARS OPTION MENU //;
    function writeYears(){
    var optYears = '';
    if(PREVIOUS.toLowerCase() == 'yes'){
    var theYears = thisYear-parseInt(YEARS/2);
    }
    else{var theYears = thisYear};
    for(var year=0; year<YEARS; year++){
    optYears += '<OPTION value="'+(theYears+year)+'">';
    optYears += (theYears+year)+'</OPTION>';
    }
    return optYears;
    }


    // FUNCTION TO WRITE START DATE MENU //;
    function startDate(){
    var startDate = '<SELECT style="font:Arial, Helvetica, sans-serif; font-size:11px" name="startDay" onchange="upDate(\'start\')">';
    startDate+= writeDays();
    startDate+= ' </SELECT>';
    startDate+= '<SELECT style="font:Arial, Helvetica, sans-serif; font-size:11px" name="startMonth" onchange="upDate(\'start\')">';
    startDate+= writeMonthes();
    startDate+= ' </SELECT>';
    startDate+= '<SELECT style="font:Arial, Helvetica, sans-serif; font-size:11px" name="startYear" onchange="upDate(\'start\')">';
    startDate+= writeYears();
    startDate+= ' </SELECT>';
    document.write(startDate);
    chkOptions('start');
    }


    // FUNCTION TO WRITE END DATE MENU //;
    function endDate(){
    var endDate = '<SELECT name="endDay" style="font:Arial, Helvetica, sans-serif; font-size:11px" onchange="upDate(\'end\')">';
    endDate+= writeDays();
    endDate+= ' </SELECT>';
    endDate+= '<SELECT name="endMonth" style="font:Arial, Helvetica, sans-serif; font-size:11px" onchange="upDate(\'end\')">';
    endDate+= writeMonthes();
    endDate+= ' </SELECT>';
    endDate+= '<SELECT name="endYear" style="font:Arial, Helvetica, sans-serif; font-size:11px" onchange="upDate(\'end\')">';
    endDate+= writeYears();
    endDate+= ' </SELECT>';
    document.write(endDate);
    chkOptions('end');
    }


    // FUNCTION TO CHECK USER DEFINED OPTIONS //;
    function chkOptions(select){
    var form = document.forms[FORM];
    if(DISPLAY.toLowerCase() == 'yes'){
    if(PREVIOUS.toLowerCase() == 'yes'){
    form[select+'Year'][parseInt(YEARS/2)].selected = true;
    }

    else{form[select+'Year'][0].selected = true};
    form[select+'Month'][thisMonth].selected = true;
    form[select+'Day'][thisDay-1].selected = true;
    setDays(select);
    }
    }


    // FUNCTION TO UPDATE END DATE OPTIONS WHEN START DATE CHANGES //;
    function upDate(select){
    var form = document.forms[FORM];
    if(UPDATE.toLowerCase() == 'yes' && select == 'start'){
    form.endYear.selectedIndex = form.startYear.selectedIndex;
    form.endMonth.selectedIndex = form.startMonth.selectedIndex;
    form.endDay.selectedIndex = form.startDay.selectedIndex;
    setDays('start');
    setDays('end');
    }

    else{
    setDays(select);
    }
    }


    // FUNCTION TO VALIDATE FORM INPUT DATES //;
    function valiDate(){
    var form = document.forms[FORM];
    var startDate = form.startMonth.value+' ';
    startDate+= form.startDay.value+' ';
    startDate+= form.startYear.value;

    var endDate = form.endMonth.value+' ';
    endDate+= form.endDay.value+' ';
    endDate+= form.endYear.value;

    if(new Date(startDate)>new Date(endDate)){
    alert("Not a Valid Date!\n\nPlease choose another end date.");
    return false;
    }

    else{ return true };
    }




    // End -->

    </script>



    <a style="font-family: Arial, Helvetica, sans-serif; font-size:12px">Depart </a><br>
    <script type="text/javascript">startDate()</script>
    <br>
    <a style="font-family: Arial, Helvetica, sans-serif; font-size:12px">Return </a><br>
    <script type="text/javascript">endDate()</script>

    <input TYPE="HIDDEN" name="Outbound" value="">
    <INPUT TYPE="HIDDEN" NAME="Inbound" VALUE="">


    <script type="text/javascript">startDate()</script>
    <br>
    <a style="font-family: Arial, Helvetica, sans-serif; font-size:12px">Return </a><br>
    <script type="text/javascript">endDate()</script>
     
    mpace030, Apr 1, 2007 IP