asked on

Reset Dates based on dropdown Value

Hi Experts,

I have a form(Snapshot attached) with a dropdown fields (Daily, Weekly, Monthly, Quarterly, Annualy, 12_Month_Rolling).

Based on these options, the default values on From and To fields are shown when the page first loads. Default are something like (To: Todays date and From date would be Todays- 5) Same goes for all other options.

Earlier I used for face problem with reseting the form when page loads the second time(On click of Update Chart button), but with complete of one of the experts here, I was able to fix that problem. The code I got for that issue is in this link:

https://www.experts-exchange.com/questions/24556741/How-to-reset-a-form-using-Javascript.html

This only resets the Dropdown value, not the From and To. I tried on my own, but Honestly now I have no clue to to do it. Can you please help meout resetting the whole form.(Even after submitting the form.)

<script>
 
var timelineGaps = new Array();
 
timelineGaps["Daily"] = 5;
timelineGaps["Weekly"] = 30;
timelineGaps["Monthly"] = 150;
timelineGaps["Quarterly"] = 450;
timelineGaps["Annually"] = 600;
 
//max limit
var timelineGapsMax = new Array();
 
timelineGapsMax["Daily"] = 31;
timelineGapsMax["Weekly"] = 105;
timelineGapsMax["Monthly"] = 456;
timelineGapsMax["Quarterly"] = 730;
timelineGapsMax["Annually"] = 1725;
 
function validateDates() {
// get all the inputs
var from = document.getElementById('from_date');
var to = document.getElementById('to_date');
var timeline = document.getElementById('tm');
 
var minutes = 1000 * 60;
var hours = minutes * 60;
var days = hours * 24;
 
var df = Date.parse(from.value);
var dt = Date.parse(to.value);
var gap = (dt - df)/days;
 
if (df > dt) {
       alert('From date is higher than To date. Please reenter the
dates correctly!');
} else if (timelineGaps[timeline.value] > gap ) {
alert('Date ranges are entered incorrectly. Please note that you need to
enter atleast 5 days for Daily ,5 weeks for Weekly ,5 months for Monthly
,5 quarters for Quarterly & 2 years for Annually choices!');
   return false;
} else if (timelineGapsMax[timeline.value] < gap ) {
       alert('The dates selected do not agree with the time period,
please re-enter the calendar dates. Limits:     Daily:31 days
Weekly:15 weeks Monthly:15 months Quarterly:8 quarters  Annually:2
years.');
       return false;
       }
  return true;
}
</script>
 
<script>
 
function setDefaultDates() {
       var freq = document.getElementById('tm').value;
       //alert(freq);
 
               var dt=new Date();
               var oneDay = 1000*60*60*24;
               var fiveWeeks = oneDay * 36;
               var fiveMonths = oneDay * 152;
               var fiveQuarters = oneDay * 456;
               var annual = oneDay * 1000;
               var rollMonth = oneDay * 365;
 
               var eDay=dt.getDate()-1;
               var eMonth=dt.getMonth() + 1;
               var eYear=dt.getFullYear();
 
               //daily
               var sDay=dt.getDate()-6;
               var sMonth=dt.getMonth() + 1;
               var sYear=dt.getFullYear();
 
               //weekly
               var wklyEndDt = new Date(dt.getTime() - fiveWeeks);
               //alert(wklyEndDt);
               var wklyDay;
               var wklyModifiedDay = wklyEndDt.getDay();
               if (wklyModifiedDay == 6) {
                       wklyDay = wklyEndDt.getDate();
               } else if (wklyModifiedDay == 5) {
                       wklyDay = new Date((wklyEndDt.getTime() +
oneDay)).getDate();
               } else if (wklyModifiedDay == 4) {
                       wklyDay = new Date((wklyEndDt.getTime() + 2 *
oneDay)).getDate();
               } else if (wklyModifiedDay == 3) {
                       wklyDay = new Date((wklyEndDt.getTime() + 3 *
oneDay)).getDate();
                       //alert(wklyDay);
               } else if (wklyModifiedDay == 2) {
                       wklyDay = new Date((wklyEndDt.getTime() + 4 *
oneDay)).getDate();
               } else if (wklyModifiedDay == 1) {
                       wklyDay = new Date((wklyEndDt.getTime() + 5 *
oneDay)).getDate();
               } else if (wklyModifiedDay == 0) {
                       wklyDay = new Date((wklyEndDt.getTime() + 6 *
oneDay)).getDate();
               }
 
               var wklyMonth = wklyEndDt.getMonth()+1;
               var wklyYear = wklyEndDt.getFullYear();
               //alert(wklyMonth + "/" + wklyDay + "/" + wklyYear);
 
               //monthly
               var monthlyEndDt = new Date(dt.getTime() - fiveMonths);
               //var monthlyDay = monthlyEndDt.getDate();
               var monthlyDay = 1;
               var monthlyMonth = monthlyEndDt.getMonth()+1;
               var monthlyYear = monthlyEndDt.getFullYear();
               //alert(monthlyMonth + "/" + monthlyDay + "/" +
monthlyYear);
 
               //quarterly
               var qrlyEndDt = new Date(dt.getTime() - fiveQuarters);
               //var qrlyDay = qrlyEndDt.getDate();
               var qrlyDay = 1;
               var qrlyMonth = qrlyEndDt.getMonth()+1;
               var qrlyYear = qrlyEndDt.getFullYear();
               //alert(qrlyMonth + "/" + qrlyDay + "/" + qrlyYear);
 
               //Annually
               var yrlyEndDt = new Date(dt.getTime() - annual);
               //var yrlyDay = yrlyEndDt.getDate();
               var yrlyDay = 1;
               var yrlyMonth = yrlyEndDt.getMonth()+1;
               var yrlyYear = yrlyEndDt.getFullYear();
               //alert(yrlyMonth + "/" + yrlyDay + "/" + yrlyYear);
 
               //12 month rolling
               var rollEndDt = new Date(dt.getTime() - rollMonth);
               //var rollDay = rollEndDt.getDate();
               var rollDay = 1;
               var rollMonth = rollEndDt.getMonth()+1;
               var rollYear = rollEndDt.getFullYear();
               //alert(rollMonth + "/" + rollDay + "/" + rollYear);
 
               if (freq == "Daily")
               {
                       document.getElementById("to_date").value =
eMonth + "/" + eDay + "/" + eYear;
                       document.getElementById("from_date").value =
sMonth + "/" + sDay + "/" + sYear;
               } else if (freq == "Weekly")
               {
                       document.getElementById("to_date").value =
eMonth + "/" + eDay + "/" + eYear;
                       document.getElementById("from_date").value =
wklyMonth + "/" + wklyDay + "/" + wklyYear;
               } else if (freq == "Monthly")
               {
                       document.getElementById("to_date").value =
eMonth + "/" + eDay + "/" + eYear;
                       document.getElementById("from_date").value =
monthlyMonth + "/" + monthlyDay + "/" + monthlyYear;
               } else if (freq == "Quarterly")
               {
                       document.getElementById("to_date").value =
eMonth + "/" + eDay + "/" + eYear;
                       document.getElementById("from_date").value =
qrlyMonth + "/" + qrlyDay + "/" + qrlyYear;
               } else if (freq == "Annually")
               {
                       document.getElementById("to_date").value =
eMonth + "/" + eDay + "/" + eYear;
                       document.getElementById("from_date").value =
yrlyMonth + "/" + yrlyDay + "/" + yrlyYear;
               } else if (freq == "12_Month_Rolling")
               {
                       document.getElementById("to_date").value =
eMonth + "/" + eDay + "/" + eYear;
                       document.getElementById("from_date").value =
rollMonth + "/" + rollDay + "/" + rollYear;
               }
       }
</script>