Solved

Reset Dates based on dropdown Value

Posted on 2009-07-10
59
280 Views
Last Modified: 2012-05-07
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:

 http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_24556741.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>

Open in new window

reset.png
0
Comment
Question by:aman0711
  • 30
  • 29
59 Comments
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Can you explain to what values the From/To should be reset?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Sure Sir,
                  These are gap values for From and To:
                 timelineGaps["Daily"] = 5;
                 timelineGaps["Weekly"] = 30;
                 timelineGaps["Monthly"] = 150;
                 timelineGaps["Quarterly"] = 450;
                 timelineGaps["Annually"] = 600;
                 First the page would load with Monthly, and From - To = 150 days... Now lets say user entered its own dates and Click Update Chart to get fresh data.. once he gets the data and Clicks reset to default then He Should See Monthly(which was fixed by other expert) and From and To dates resetted to Todays Date - 150 days.
                 Hope I explained it fine :)
   
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
hm.  I "think" I see.

While I was looking at your code, I saw this nested if...

  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();
  }

Do you know that there is a much easier way to do this?
You can greatly simplify things once you realize that the wklyModifiedDay values are all integers from 0..6
and that given one of these values, you want wklyDay to be a future date from 0..6 days in the future, and that the relationship between wklyModifiedDay and the number of days to be added is an inverse relationship.

So when wklyModifiedDay == 6 => add 0 days,
when wklyModifiedDay == 5 => add 1 day,
when wklyModifiedDay == 4 => add 2 days, and so on.

So, if we subtract wklyModifiedDay from 6, we get the number of days to be added, and this collection of nested if statements can be replaced by:

wklyDay = new Date( ( wklyEndDt.getTime() + ( 6 - wklyModifiedDay ) * oneDay ) ).getDate();


Where is the current "reset" routine?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Current Reset Rountin?
 
You mean the HTML form that is reseting it?
this is here:
 http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_24556741.html

Actually my colleague wrote that big chunk of code. We are newbies in this :)
And if I am correct, then we were given a task that, From date on weekly, should always be the first day of the week. I guess thats why he did that.
So now the requirement dropped down to , Resetting to Monthly(which is already thr), and Populating From and To, Corresponding to Monthly.
You really chopped off at least 20 lines of code in just one line :)
 
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Do you have some code that is executed when the page is loaded?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Yes its some java code.. On the backend
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
If so, it could be called just before the validateDates() executes the "return true;"
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
We may need to have some coded executed when the page is loaded that saves the original From/To values, and which is called (as noted above) to restore the values.

It might be as simple as something like this:

and then adding these lines just in front of the "return true" in validateDates():
----------------------------------------------------------------------
  if ( initial_From ) {
    document.getElementById( 'from_date' ).value = initial_From;
  }
  if ( initial_To ) {
    document.getElementById( 'to_date' ).value = initial_To;
  }
  return true;
var initial_From = null;

var initial_To   = null;
 

var onload = window.onload;

window.onload = function() {

  if ( onload ) {

    onload();

  }

  var from_date = document.getElementById( 'from_date' );

  if ( from_date ) {

    initial_From = from_date.value;

  }

  var to_date = document.getElementById( 'to_date' );

  if ( to_date ) {

    initial_To = to_date.value;

  }

}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Thank you sir :)
I will try it in the morning and get back to u with results :)
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
I thought about it while in bed.  

There is an error.  We don't want to reset the values BEFORE we return true, we want to do it AFTER.

So  what we need to to have something like this "just before" the "return true":

...
  setTimeout( 'restore()', 100 );
  return true;
}

This says to wait for 1/10 of a second then call the restore() function.
This should give the submit plenty of time to complete before restoring the initial values.
function restore() {

  if ( initial_From ) {

    document.getElementById( 'from_date' ).value = initial_From;

  }

  if ( initial_To ) {

    document.getElementById( 'to_date' ).value = initial_To;

  }

}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
>> This should give the submit plenty of time to complete before restoring the initial values

Morning Sir,

               I guess we are on different levels :)

              We dont need to display defaults after Submit is clicked. Only when:

                 * User Clicked Sumbit, he gets new Databack, and From and To fields are populated with values he picked...
                Now he can click Reset to Defaults. and this would restore it to, Monthly and corresponding From and to dates
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
I'm sorry, I don't quite follow you.

I thought that you were interested in restoring the value after the submit.

So if you want to have a reset button to restore the values instead, you could have a button like the following.

Is that what you want/need?

<input type='button' value='Restore' onclick='restore()'>

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Hmm Actually,
 
           Other expert gave me this line of code and told me that if would reset From and To dates, I just need to replace ALPHA and BETA. with from and to fields ids,.
         but somehow it isnt working,, this is my complete page.

          Right now it resets the drop down to Monthly. But along with that I want the dates to be resetted to respective monthly From and To.

           

<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 (timelineGapsMax[timeline.value] < gap ) {

	alert('The dates selected do not agree with the time period, please re-enter the calendar dates.');

	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>
 

<!--[if IE]>

<style type="text/css"> 

.tofrom { padding-top:4px; }

.calimg { margin:3px 0 0 0; }

</style>

<![endif]-->

</head>

<body>

<div id="right-col">

<!-- begin right column -->

<div style="padding:0 33px 0 0; margin-bottom:-18px;" align="center"><a href="#" class="tip" style='text-decoration:none'>Print<span>To print a single chart right click on the chart and select Print Chart</span></a>&nbsp; &nbsp; &nbsp;<a href="#" class="tip" style='text-decoration:none'>Save<span>To save a chart right click on the chart and select one of the following</span></a> </div>

<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">

<div style="font-weight:bold; color:#000000 ">Selection</div>

<div style="font-weight:100; line-height:normal; font-size:9px; margin:5px 0;"> Select from the options below and then click on Update Chart.</div>

 <form:form commandName="sideForm" onsubmit="return validateDates()">

<div style="font-weight:bold; color:#000">Timeline</div>
 

<div align="center" style="margin:0 0 5px 0; ">

<div style="margin:0 0 5px 0;"><form:select path="timeline" items="${timeline}" id="tm" onchange="setDefaultDates()"/></div>

</div>

<div style="color:black;">

<div class="tofrom">From:</div>

<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
 

<form:input path="startDt" id="from_date" size="7" maxlength="10" />
 

</div>

<div style="color:black;">

<div class="tofrom">To:</div>

<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
 

<form:input path="endDt" id="to_date" size="7" maxlength="12" />
 

</div>

<div style="font-wight:bold; color:#000">*15 Month Max Per Chart</div>

<br />

<div style="float:left; font-size:9px; font-weight:lighter; padding:0; color:black; color:blue"><a href="#" style='text-decoration: none; color:#2525FF;' onClick='$("option:contains(\"Monthly\")").attr("selected","selected");return false'>Reset To Defaults</a></div>

<h6 style="font-size:4px; font-wight:lighter; float:left;">

<div style="width:60px; font-size:.5em; font-weight:lighter; background: #FFFFFF ">

<input type="submit" value="Update Chart" onsubmit="return validateDates()"  />

</div>

</h6>

<div style="clear:both;"></div>

</form:form>

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
I don't see ALPHA, BETA, or any form submit action.

Does this page contact a server application when the form is submitted?
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
I do see how the validation routine is called by the submit button...

Normally, there would be an action attribute on the form tag that would identify what to do, or where to go when the validate() function returns true.
<input type="submit" value="Update Chart" onsubmit="return validateDates()"  />

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Yes this page sends Timeline and Froma dnTo dates to the server.

Actually this is the line that resets the form. Its in that code.

<a href="#" style='text-decoration: none; color:#2525FF;' onClick='$("option:contains(\"Monthly\")").attr("selected","selected");return false'>Reset To Defaults</a></div>

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Wow, I would never have seen that.  Maybe I really should learn jQuery... :-)

It looks like all that does it to reset the "selected" value for the "timelines" select statement to the option that contains "Monthly".

What if we changed that link to be something like this:

<a href="#" style='text-decoration: none; color:#2525FF;' onClick='return restore()'>Reset To Defaults</a></div>

and changed the restore function definition to something like:
function restore() {

  $("option:contains(\"Monthly\")").attr("selected","selected");

  if ( initial_From ) {

    document.getElementById( 'from_date' ).value = initial_From;

  }

  if ( initial_To ) {

    document.getElementById( 'to_date' ).value = initial_To;

  }

  return false;

}

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
You are missing some code at the very beginning where you show how, and from where the jQuery code is to be loaded.

You are also missing the <html> and <head> tags, as well as a DOCTYPE.
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
I am sure you dont need to learn jquery,, you are a Sage in javascript :)

This is the complete code.
Sir, where should I declare the function you gave me? in the <head> ?? or inside the same script

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<html>

<head>

<style type="text/css">

           @import url("/analytics/static/calendar/mystyle.css");

.tofrom {

        height:18px;

        float:left;

        width:40px;

        padding-top:3px;

}

.calimg {

        margin:1px 0 0 0;

        float:left;

        width:28px;

}

</style>

<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>

<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>

<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>

<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
 
 

<!--[if IE]>

<style type="text/css"> 

.tofrom { padding-top:4px; }

.calimg { margin:3px 0 0 0; }

</style>

<![endif]-->

</head>

<body>

<div id="right-col">

<!-- begin right column -->

<div style="padding:0 33px 0 0; margin-bottom:-18px;" align="center"><a href="printSavePdf.html?height=300&width=300" class="thickbox">CSS</a></div>

<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">

<div style="font-weight:bold; color:#000000 ">Selection</div>

<div style="font-weight:100; line-height:normal; font-size:9px; margin:5px 0;"> Select from the options below and then click on Update Chart.</div>

 <form:form commandName="sideForm">

<div style="font-weight:bold; color:#000">Timeline</div>
 

<div align="center" style="margin:0 0 5px 0; ">

<div style="margin:0 0 5px 0;"><form:select path="timeline" items="${timeline}" id="tm"/></div>

</div>

<div style="color:black;">

<div class="tofrom">From:</div>

<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
 

<form:input path="startDt" id="from_date" size="7" maxlength="10" />
 

</div>

<div style="color:black;">

<div class="tofrom">To:</div>

<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
 

<form:input path="endDt" id="to_date" size="7" maxlength="12" />
 

</div>

<div style="font-wight:bold; color:#000">*15 Month Max Per Chart</div>

<br />

<div style="float:left; font-size:9px; font-weight:lighter; padding:0; color:black; color:blue"><a href="#" style='text-decoration: none; color:#2525FF;' onClick="document.forms[0].reset();return false">Reset To Defaults</a></div>

<br />

<h6 style="font-size:4px; font-wight:lighter; padding-left:17px;">

<div style="width:60px; font-size:.5em; font-weight:lighter; background: #FFFFFF ">

<input type="submit" value="Update Chart" />

</div>

</h6>

<div style="clear:both;"></div>

</form:form>

</div>

<br />
 
 

<div style="border:3px solid #99CCFF; width:160px; margin-left:5px; padding-left:2px; background:white;">

<div style="font-weight:bold; color:#EDA12E; background: #EBEBEB;"><b>System Bulletin</b></div>

<br />

<div style="font-weight:100; color:#000; line-height:normal; font-size:9px; margin:5px 0;">${bulletin}</div>

 

<!-- end right column, then column-wrapper -->

</div>

</div>

</body>

</html>

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
the restore() function would be in the <script> clause, or in the external file referenced by the src attribute of one of your script tags.

If I had to guess, I would say that you probably have the script shown above (i.e., in the code snippet portion of the question) in ashscript1.js.

You will need to add the code from http:#a24828919 as well as the restore() function from http:#a24831619 and revise the anchor tag as shown in http:#a24831619

Does that make sense?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
I am really very sorry Sir,

                Actually my mind is like stuck right now... havent had enough sleep :(

                This is the code. the script is in <Head>..
 
                The ashscript you mentioned, is for a popup calendar.

                In fact this code, doesnt even uses jquery at all.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<html>

<head>

<style type="text/css">

           @import url("/analytics/static/calendar/mystyle.css");

.tofrom {

        height:18px;

        float:left;

        width:40px;

        padding-top:3px;

}

.calimg {

        margin:1px 0 0 0;

        float:left;

        width:28px;

}

</style>

<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>
 

<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 (timelineGapsMax[timeline.value] < gap ) {

	alert('The dates selected do not agree with the time period, please re-enter the calendar dates.');

	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>
 

<!--[if IE]>

<style type="text/css"> 

.tofrom { padding-top:4px; }

.calimg { margin:3px 0 0 0; }

</style>

<![endif]-->

</head>

<body>

<div id="right-col">

<!-- begin right column -->

<div style="padding:0 33px 0 0; margin-bottom:-18px;" align="center"><a href="#" class="tip" style='text-decoration:none'>Print<span>To print a single chart right click on the chart and select Print Chart</span></a>&nbsp; &nbsp; &nbsp;<a href="#" class="tip" style='text-decoration:none'>Save<span>To save a chart right click on the chart and select one of the following</span></a> </div>

<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">

<div style="font-weight:bold; color:#000000 ">Selection</div>

<div style="font-weight:100; line-height:normal; font-size:9px; margin:5px 0;"> Select from the options below and then click on Update Chart.</div>

 <form:form commandName="sideForm" onsubmit="return validateDates()">

<div style="font-weight:bold; color:#000">Timeline</div>
 

<div align="center" style="margin:0 0 5px 0; ">

<div style="margin:0 0 5px 0;"><form:select path="timeline" items="${timeline}" id="tm" onchange="setDefaultDates()"/></div>

</div>

<div style="color:black;">

<div class="tofrom">From:</div>

<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
 

<form:input path="startDt" id="from_date" size="7" maxlength="10" />
 

</div>

<div style="color:black;">

<div class="tofrom">To:</div>

<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
 

<form:input path="endDt" id="to_date" size="7" maxlength="12" />
 

</div>

<div style="font-wight:bold; color:#000">*15 Month Max Per Chart</div>

<br />

<div style="float:left; font-size:9px; font-weight:lighter; padding:0; color:black; color:blue"><a href="#" style='text-decoration: none; color:#2525FF;' onClick='$("option:contains(\"Monthly\")").attr("selected","selected");return false'>Reset To Defaults</a></div>

<h6 style="font-size:4px; font-wight:lighter; float:left;">

<div style="width:60px; font-size:.5em; font-weight:lighter; background: #FFFFFF ">

<input type="submit" value="Update Chart" onsubmit="return validateDates()"  />

</div>

</h6>

<div style="clear:both;"></div>

</form:form>

</div>

<br />
 
 

<div style="border:3px solid #99CCFF; width:160px; margin-left:5px; padding-left:2px; background:white;">

<div style="font-weight:bold; color:#EDA12E; background: #EBEBEB;"><b>System Bulletin</b></div>

<br />

<div style="font-weight:100; color:#000; line-height:normal; font-size:9px; margin:5px 0;">${bulletin}</div>

 

<!-- end right column, then column-wrapper -->

</div>

</div>

</body>

</html>

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
ok,  I understand completely.

- change the <script> tag to be:

<script type='text/javascript'>

- Add the following, just before the closing script tag (i.e., line 172)

- and change the <a tag (anchor) in line 210 to be

<a href="#" style='text-decoration: none; color:#2525FF;' onClick='return restore()'>Reset To Defaults</a></div>
function restore() {

  $("option:contains(\"Monthly\")").attr("selected","selected");

  if ( initial_From ) {

    document.getElementById( 'from_date' ).value = initial_From;

  }

  if ( initial_To ) {

    document.getElementById( 'to_date' ).value = initial_To;

  }

  return false;

}
 

var initial_From = null;

var initial_To   = null;

 

var onload = window.onload;

window.onload = function() {

  if ( onload ) {

    onload();

  }

  var from_date = document.getElementById( 'from_date' );

  if ( from_date ) {

    initial_From = from_date.value;

  }

  var to_date = document.getElementById( 'to_date' );

  if ( to_date ) {

    initial_To = to_date.value;

  }

}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Thank You sir,

             So monthly is still getting a reset but, its not resetting the From and To fields
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Let's see what values were saved...
function restore() {

  $("option:contains(\"Monthly\")").attr("selected","selected");

  alert( 'initial_From: ' + initial_From );

  if ( initial_From ) {

    document.getElementById( 'from_date' ).value = initial_From;

  }

  alert( 'initial_To: ' + initial_To );

  if ( initial_To ) {

    document.getElementById( 'to_date' ).value = initial_To;

  }

  return false;

}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Hmmm... both came us as null sir.
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
which says that the onload function isn't being exeucted...

In this update http:#a24831666, you have these lines:

<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>
<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>

In this update http:#a24831731, you only have this:

<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>

Why?  Which contains the actual code that you are using?

put the <script type='text/javascript'> containing this:

var timelineGaps = new Array();

as the last script section.
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
I am sorry I dont know how those scripts left out,

 I did put them this time, but getting the same null.

I followed the steps you jut suggested.. and here is the complete code

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<html>

<head>

<style type="text/css">

           @import url("/analytics/static/calendar/mystyle.css");

.tofrom {

        height:18px;

        float:left;

        width:40px;

        padding-top:3px;

}

.calimg {

        margin:1px 0 0 0;

        float:left;

        width:28px;

}

</style>

<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>

<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>

<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>

<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
 
 
 

<script type='text/javascript'>
 

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;

		}

	}

function restore() {

	  $("option:contains(\"Monthly\")").attr("selected","selected");

	  alert( 'initial_From: ' + initial_From );

	  if ( initial_From ) {

	    document.getElementById( 'from_date' ).value = initial_From;

	  }

	  alert( 'initial_To: ' + initial_To );

	  if ( initial_To ) {

	    document.getElementById( 'to_date' ).value = initial_To;

	  }

	  return false;

	}
 

	 

	var initial_From = null;

	var initial_To   = null;

	 

	var onload = window.onload;

	window.onload = function() {

	  if ( onload ) {

	    onload();

	  }

	  var from_date = document.getElementById('from_date');

	  if ( from_date ) {

	    initial_From = from_date.value;

	  }

	  var to_date = document.getElementById( 'to_date' );

	  if ( to_date ) {

	    initial_To = to_date.value;

	  }

	}
 
 

</script>
 

<script type='text/javascript'>
 

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 (timelineGapsMax[timeline.value] < gap ) {

	alert('The dates selected do not agree with the time period, please re-enter the calendar dates.');

	return false;

	}

   return true;

}

</script>
 

<!--[if IE]>

<style type="text/css"> 

.tofrom { padding-top:4px; }

.calimg { margin:3px 0 0 0; }

</style>

<![endif]-->

</head>

<body>

<div id="right-col">

<!-- begin right column -->

<div style="padding:0 33px 0 0; margin-bottom:-18px;" align="center"><a href="#" class="tip" style='text-decoration:none'>Print<span>To print a single chart right click on the chart and select Print Chart</span></a>&nbsp; &nbsp; &nbsp;<a href="#" class="tip" style='text-decoration:none'>Save<span>To save a chart right click on the chart and select one of the following</span></a> </div>

<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">

<div style="font-weight:bold; color:#000000 ">Selection</div>

<div style="font-weight:100; line-height:normal; font-size:9px; margin:5px 0;"> Select from the options below and then click on Update Chart.</div>

 <form:form commandName="sideForm" onsubmit="return validateDates()">

<div style="font-weight:bold; color:#000">Timeline</div>
 

<div align="center" style="margin:0 0 5px 0; ">

<div style="margin:0 0 5px 0;"><form:select path="timeline" items="${timeline}" id="tm" onchange="setDefaultDates()"/></div>

</div>

<div style="color:black;">

<div class="tofrom">From:</div>

<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
 

<form:input path="startDt" id="from_date" size="7" maxlength="10" />
 

</div>

<div style="color:black;">

<div class="tofrom">To:</div>

<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
 

<form:input path="endDt" id="to_date" size="7" maxlength="12" />
 

</div>

<div style="font-wight:bold; color:#000">*15 Month Max Per Chart</div>

<br />

<div style="float:left; font-size:9px; font-weight:lighter; padding:0; color:black; color:blue"><a href="#" style='text-decoration: none; color:#2525FF;' onClick='return restore()'>Reset To Defaults</a></div>

<h6 style="font-size:4px; font-wight:lighter; float:left;">

<div style="width:60px; font-size:.5em; font-weight:lighter; background: #FFFFFF ">

<input type="submit" value="Update Chart" onsubmit="return validateDates()"  />

</div>

</h6>

<div style="clear:both;"></div>

</form:form>

</div>

<br />
 
 

<div style="border:3px solid #99CCFF; width:160px; margin-left:5px; padding-left:2px; background:white;">

<div style="font-weight:bold; color:#EDA12E; background: #EBEBEB;"><b>System Bulletin</b></div>

<br />

<div style="font-weight:100; color:#000; line-height:normal; font-size:9px; margin:5px 0;">${bulletin}</div>

 

<!-- end right column, then column-wrapper -->

</div>

</div>

</body>

</html>

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
replace Lines 152 to 165

with these:
	var onload = window.onload;

	window.onload = function() {

	  if ( onload ) {

	    onload();

	  }

	  var from_date = document.getElementById('from_date');

	  if ( from_date ) {

	    initial_From = from_date.value;

	  } else {

        alert( '"from_date" not found.' )

      }

	  var to_date = document.getElementById( 'to_date' );

	  if ( to_date ) {

	    initial_To = to_date.value;

	  } else {

        alert( '"to_date" not found.' )

	  }

	}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Hmmm.. Same result:(

Null and null :(

here is the updated code :(



<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<html>

<head>

<style type="text/css">

           @import url("/analytics/static/calendar/mystyle.css");

.tofrom {

        height:18px;

        float:left;

        width:40px;

        padding-top:3px;

}

.calimg {

        margin:1px 0 0 0;

        float:left;

        width:28px;

}

</style>

<script type="text/javascript" src="/analytics/static/calendar/ashscript1.js"></script>

<script type="text/javascript" src="/analytics/static/zoom/jquery.js"></script>

<script type="text/javascript" src="/analytics/static/zoom/thickbox.js"></script>

<link rel="stylesheet" href="/analytics/static/zoom/thickbox.css" type="text/css" media="screen" />
 
 
 
 

<script type='text/javascript'>
 

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;

		}

	}
 

function restore() {

	  $("option:contains(\"Monthly\")").attr("selected","selected");

	  alert( 'initial_From: ' + initial_From );

	  if ( initial_From ) {

	    document.getElementById( 'from_date' ).value = initial_From;

	  }

	  alert( 'initial_To: ' + initial_To );

	  if ( initial_To ) {

	    document.getElementById( 'to_date' ).value = initial_To;

	  }

	  return false;

	}
 

	 

	var initial_From = null;

	var initial_To   = null;

	 

	var onload = window.onload;

	window.onload = function() {

	  if ( onload ) {

	    onload();

	  }

	  var from_date = document.getElementById('from_date');

	  if ( from_date ) {

	    initial_From = from_date.value;

	  } else {

        alert( '"from_date" not found.' )

      }

	  var to_date = document.getElementById( 'to_date' );

	  if ( to_date ) {

	    initial_To = to_date.value;

	  } else {

        alert( '"to_date" not found.' )

	  }

	}
 
 

</script>
 

<script type='text/javascript'>
 

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 (timelineGapsMax[timeline.value] < gap ) {

	alert('The dates selected do not agree with the time period, please re-enter the calendar dates.');

	return false;

	}

   return true;

}

</script>
 

<!--[if IE]>

<style type="text/css"> 

.tofrom { padding-top:4px; }

.calimg { margin:3px 0 0 0; }

</style>

<![endif]-->

</head>

<body>

<div id="right-col">

<!-- begin right column -->

<div style="padding:0 33px 0 0; margin-bottom:-18px;" align="center"><a href="#" class="tip" style='text-decoration:none'>Print<span>To print a single chart right click on the chart and select Print Chart</span></a>&nbsp; &nbsp; &nbsp;<a href="#" class="tip" style='text-decoration:none'>Save<span>To save a chart right click on the chart and select one of the following</span></a> </div>

<div class="sidebar-panel" style="border:5px solid #99CCFF; width:145px; padding:2px; background:white;">

<div style="font-weight:bold; color:#000000 ">Selection</div>

<div style="font-weight:100; line-height:normal; font-size:9px; margin:5px 0;"> Select from the options below and then click on Update Chart.</div>

 <form:form commandName="sideForm" onsubmit="return validateDates()">

<div style="font-weight:bold; color:#000">Timeline</div>
 

<div align="center" style="margin:0 0 5px 0; ">

<div style="margin:0 0 5px 0;"><form:select path="timeline" items="${timeline}" id="tm" onchange="setDefaultDates()"/></div>

</div>

<div style="color:black;">

<div class="tofrom">From:</div>

<div class="calimg"><img src="/analytics/static/images/CAL.PNG" name="Calendar" width="18" height="18" id="Calendar" onClick="displayDatePicker('from_date');" /></div>
 

<form:input path="startDt" id="from_date" size="7" maxlength="10" />
 

</div>

<div style="color:black;">

<div class="tofrom">To:</div>

<div class="calimg"><img name="Calendar" src="/analytics/static/images/CAL.PNG" width="18" height="18" id="Calendarm" onClick="displayDatePicker('to_date');" /> </div>
 

<form:input path="endDt" id="to_date" size="7" maxlength="12" />
 

</div>

<div style="font-wight:bold; color:#000">*15 Month Max Per Chart</div>

<br />

<div style="float:left; font-size:9px; font-weight:lighter; padding:0; color:black; color:blue"><a href="#" style='text-decoration: none; color:#2525FF;' onClick='return restore()'>Reset To Defaults</a></div>

<h6 style="font-size:4px; font-wight:lighter; float:left;">

<div style="width:60px; font-size:.5em; font-weight:lighter; background: #FFFFFF ">

<input type="submit" value="Update Chart" onsubmit="return validateDates()"  />

</div>

</h6>

<div style="clear:both;"></div>

</form:form>

</div>

<br />
 
 

<div style="border:3px solid #99CCFF; width:160px; margin-left:5px; padding-left:2px; background:white;">

<div style="font-weight:bold; color:#EDA12E; background: #EBEBEB;"><b>System Bulletin</b></div>

<br />

<div style="font-weight:100; color:#000; line-height:normal; font-size:9px; margin:5px 0;">${bulletin}</div>

 

<!-- end right column, then column-wrapper -->

</div>

</div>

</body>

</html>

Open in new window

0
Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
ok, let's have the window.onload tell us what it is saving...

Replace lines 154-170 with
window.onload = function() {

  if ( onload ) {

    onload();

  }

  var from_date = document.getElementById('from_date');

  if ( from_date ) {

    initial_From = from_date.value;

    alert( 'from_date = "' + initial_From + '"' );

  } else {

    alert( '"from_date" not found.' );

  }

  var to_date = document.getElementById( 'to_date' );

  if ( to_date ) {

    initial_To = to_date.value;

    alert( 'to_date = "' + initial_To + '"' );

  } else {

    alert( '"to_date" not found.' );

  }

}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
So now as soon as the page loads, i am getting stack over flow at line: 244

also in the code:

        window.onload = function() {
          if ( onload ) {
            onload();

 I am getting onload cannot be resolved (inside the if)
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
interesting.  Change that code from this:

var onload = window.onload;
window.onload = function() {
  if ( onload ) {
    onload();
  }


To this:

var oldOnload = window.onload;
window.onload = function() {
  if ( oldOnload ) {
    oldOnload();
  }
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Did that... still the same error Sir :(


Snap shot attached


javascropptweqwe.PNG
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Little progress Sir,

               with this modification, I am able to see intial From and To dates in the alert box... but its still not resetting :(
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Do the initial_From and initial_To values contain the expected date values?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Yes they do :)

But not resetting yet :(
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
ok.  Let's see if I understand this correctly.

- You see the onload messages that display the expected "initial_From" and "initial_To" values.
- You make changes,
- You click the reset link
- You see alert messages indicating that "initial_From" and "initial_To" are null

Is that right?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
No,

         Here is the Flow:

           Page loads for the first time:

            I see Monthly (because thats what default is set to) -
            I see the From and To dates corresponding to Monthly in alert boxs.

            Till this point we are good...

            Now I change Monthly to Weekly, From and To gets default values for Weekly and I hit update Chart button.. Page loads again.. with Weekly in the dropdown and dates corresponding to Weekly..

             now when i hit Reset to Defaults, Weekly resets to Monthly and then  the From and to dates for weekly show up (at this point , we need the monthly dates because reset has been hit). :(
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
ok, that's what's messing things up.

"Page loads again.."

So, at the point when the change is made from Monthy to Weekly, do you see the "initial_From" and "initial_To" values as the Weekly "From" and "To" dates?

and when you use the "Reset" link, are you still seeing the "null" values for the From and To values?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Actually that form is used with spring framework.. Tthats why we don't have any action :(
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
We are so close yet.. so far :)

Any other solution Sir?
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Do you have answers for the questions?

Q: When you change from "Monthly" to "Weekly", do you see the "initial_From" and "initial_To" value messages?

     If so, do they have the "Weekly", or the "Monthy" values?

Q: When you click the Reset link, are you still seeing alerts that indicate that initial_From and initial_To are  "null"?
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
>> Q: When you change from "Monthly" to "Weekly", do you see the "initial_From" and "initial_To" value messages?

                When I change monthly to weekly and hit updater chart.. I see initial_From and initial_To with weekly values.

 
When you click the Reset link, are you still seeing alerts that indicate that initial_From and initial_To are  "null"?

 No. On clicking Reset Link, I am seeing weekly values (i.e. the dropdown list value we picked before hitting update chart)
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
ok, I think that I'm understanding the requirement better.

Let me think about it for a few moment.

Sorry for being so obtuse.
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Not a problem Sir :) You helped me so much till now.

If we dissect the problem then it would be as simple as :

When page first loads , it has Monthly and corresponding From and To date...

Now no matter what happens (User hits Update Chart or Not), Rest To Defaults Should always restore , Monthly and those two corresponding From and To values, which were there when the page loaded first :)
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Where you currently have this:

  var from_date = document.getElementById('from_date');
  if ( from_date ) {
    initial_From = from_date.value;
    alert( 'from_date = "' + initial_From + '"' );
  } else {
    alert( '"from_date" not found.' );
  }
  var to_date = document.getElementById( 'to_date' );
  if ( to_date ) {
    initial_To = to_date.value;
    alert( 'to_date = "' + initial_To + '"' );
  } else {
    alert( '"to_date" not found.' );
  }

replace it with this:
  var from_date = document.getElementById('from_date');

  if ( from_date && !initial_From ) {

    initial_From = from_date.value;

    alert( 'from_date = "' + initial_From + '"' );

  } else {

    alert( '"from_date" not found.' );

  }

  var to_date = document.getElementById( 'to_date' );

  if ( to_date && !initial_To ) {

    initial_To = to_date.value;

    alert( 'to_date = "' + initial_To + '"' );

  } else {

    alert( '"to_date" not found.' );

  }

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
I'm not completely sure if it will work or not.

I'm trying to figure out how to determine whether the "Monthly" option has been selected, and only save the initial_From and initial_To when that is the case.
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
I am driving to office sir... Will get back to u with results in another 30 mins :)
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Sir, Now getting this error:

The operator &&;&&; is undefined for the argument type(s) Element, boolean
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Interesting.


  var from_date = document.getElementById('from_date');

  if ( from_date && ( initial_From == null ) ) {

    initial_From = from_date.value;

    alert( 'from_date = "' + initial_From + '"' );

  } else {

    alert( '"from_date" not found.' );

  }

  var to_date = document.getElementById( 'to_date' );

  if ( to_date && ( initial_To == null ) ) {

    initial_To = to_date.value;

    alert( 'to_date = "' + initial_To + '"' );

  } else {

    alert( '"to_date" not found.' );

  }

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Sir, it started working :)

I dont know what I did... but it started working...

I moved all the variables to global scope.

The instead to storing the value some where.. I directly passed the dates.

 var initial_To = eMonth + "/" + eDay + "/" + eYear;    
  var initial_From = monthlyMonth + "/" + monthlyDay + "/" + monthlyYear;

and it started to reset :-)

Can you please have a look at the code :-) and teach me a bit about the reset code you gave me :)

function setDefaultDates() {

	var freq = document.getElementById('tm').value;	

	//alert(freq);
 

		//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;

		}

	}
 

function restore() {
 

	  $("option:contains(\"Monthly\")").attr("selected","selected");

	  

	   var initial_To = eMonth + "/" + eDay + "/" + eYear; 	

	   var initial_From = monthlyMonth + "/" + monthlyDay + "/" + monthlyYear;

	  

	  if ( initial_From ) {

	    document.getElementById( 'from_date' ).value = monthlyMonth + "/" + monthlyDay + "/" + monthlyYear;

	  }

	 

	  if ( initial_To ) {

	    document.getElementById( 'to_date' ).value =  eMonth + "/" + eDay + "/" + eYear; 	

	  }

	  return false;

	}
 

	 

	var initial_From = null;

	var initial_To   = null;

	var from_date = "";

	 

	var onload = window.onload;

	window.onload = function() {

	  if ( onload ) {

	    onload();

	  }

	     from_date =  document.getElementById('from_date');

	  if ( from_date ) {

	    initial_From = from_date.value;

	  } else {

        alert( '"from_date" not found.' )

      }

	  var to_date = document.getElementById( 'to_date' );

	  if ( to_date ) {

	    initial_To = to_date.value;

	  } else {

        alert( '"to_date" not found.' )

	  }

	}
 
 

</script>

Open in new window

0
 
LVL 41

Accepted Solution

by:
HonorGod earned 500 total points
Comment Utility
Is this enough?

The restore function depends upon the existence of some global variables.  If they exist (i.e., are not null), these values will be used to restore the associated field values when the function is called.

A new onload routine is added that will save the initial values of the From and To date fields in global variables.
//--------------------------------------------------------------------

// Name: restore()

// Role: Called to restore the select value to "Monthly", and the

//       saved "from_date" and "to_date" values stored in global

//       variables.

//--------------------------------------------------------------------

function restore() {

  $("option:contains(\"Monthly\")").attr("selected","selected");
 

  var initial_To = eMonth + "/" + eDay + "/" + eYear; 	

  var initial_From = monthlyMonth + "/" + monthlyDay + "/" + monthlyYear;

  

  if ( initial_From ) {

    document.getElementById( 'from_date' ).value = monthlyMonth + "/" + monthlyDay + "/" + monthlyYear;

  }

 

  if ( initial_To ) {

    document.getElementById( 'to_date' ).value =  eMonth + "/" + eDay + "/" + eYear; 	

  }

  return false;

}
 

//--------------------------------------------------------------------

// Global variables

//-------------------------------------------------------------------- 

var initial_From = null;

var initial_To   = null;

var from_date    = '';
 

//--------------------------------------------------------------------

// Name: anonymous

// Role: Add a new Window.onload routine to save the initial From and

//       To date values.

//-------------------------------------------------------------------- 

var oldOload = window.onload;     // Initial onload value

window.onload = function() {      // New onload routine

  if ( oldOnload ) {              // If a previous "onload" routine

    oldOnload();                  //   exists, call it.

  }                               //

  //------------------------------------------------------------------

  // Look for the "from_date" input field

  //------------------------------------------------------------------

  from_date = document.getElementById( 'from_date' );

  if ( from_date ) {                   // If the field exists...

    initial_From = from_date.value;    //   Save the initial value

  } else {                             // otherwise

    alert( '"from_date" not found.' ); //   Houston, we have a problem.

  }                                    //

  //------------------------------------------------------------------

  // Look for the "to_date" input field

  //------------------------------------------------------------------

  var to_date = document.getElementById( 'to_date' );

  if ( to_date ) {                     // If the field exists...

    initial_To = to_date.value;        //   Save the initial value

  } else {                             // otherwise

    alert( '"to_date" not found.' );   //   Houston, we have a problem.

  }                                    //

}

Open in new window

0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Wow.. thank you so much Sir :)

You helped me alot :)

Sir, posting another question related to onmouseover function.. can you have a look?
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
I can try... :-)
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
Cool, I am posting an another question, will post the link here and then close this one for you
0
 
LVL 10

Author Comment

by:aman0711
Comment Utility
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Why is it in the CSS zone?
0
 
LVL 10

Author Closing Comment

by:aman0711
Comment Utility
Thanks :)
0
 
LVL 41

Expert Comment

by:HonorGod
Comment Utility
Thanks for the grade & points.

Good luck & have a great day.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

8 Experts available now in Live!

Get 1:1 Help Now