Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

JS Calendar and date question 1

Status
Not open for further replies.
RhythmAddict112

RhythmAddict112

Programmer
Jun 17, 2004
625
US
Hi all. I'm not too familiar with JS and I've got a question that I think s
hould be easy for you JSers out there...

I am using a 3rd party javascript calendar and it is working great the probl
em is it starts with todays date when I load a page up. I need it to start
with yesterdays date however...

{
var aMonths = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10',
'11', '12'];
var oForm = document.forms.sample;
if (oForm != null)
{
oForm.elements.s_yr.value = this.getYear();
oForm.elements.s_mo.value = aMonths[this.getMonth()];
oForm.elements.s_dt.value = this.getDate();
}
}


the oForm.elements.s_dt.value = this.getDate(); line is what is populating t
he day in the calendar I believe. The problem is I need to somehow subtract
a day from that. "THIS" in that line, is an object in a the .js file assoc
iated with the calendar I believe. (as i mentioned I don't know too much ab
out JS) How can I achive this? I can attach more code if necessary. Thank
you in advance.
 
Sort by date Sort by votes
At the end of the portion of the script where you handle the oCal_2 object, starting with the overlapping bold line, below, change your code to the following:

Code: 
[b]//look for this line in your code and change the lines 
// following it to match[/b]
[b]oCal_2.setStyle(4, "#666666", "#0000FF", "#FFFFFF", 0, 1);[/b]

[b]//take these lines out of the setAction fxn and put them here[/b]
var today = new Date();
var todayInMilliseconds = today.valueOf();
var oneDayInMilliseconds = 24 * 60 * 60 * 1000;var yesterday = new Date(todayInMilliseconds - oneDayInMilliseconds);  
var aMonths = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'];

[b]//notice, setAction now empty[/b]
oCal_2.setAction     = function()
{
}

[b]//here's an IMPORTANT change.  Note the parameters being sent[/b]
oCal_2.display(yesterday.getYear(), aMonths[yesterday.getMonth()], yesterday.getDate());

[b]//now THIS function will be called with the BODY tag's onload event[/b]
function displayYesterday()
{
 var oForm = document.forms.sample;
 if (oForm != null)
 {
  oForm.elements.s_yr.value = yesterday.getYear();
  oForm.elements.s_mo.value = aMonths[yesterday.getMonth()];
  oForm.elements.s_dt.value = yesterday.getDate();
 }
}

Then, update the BODY tag to:

Code: 
<BODY style="OVERFLOW: auto;  important" leftMargin=0 rightMargin=0
topMargin=0 onload='[b]displayYesterday()[/b]'>

...and I think we've nailed it!

--Dave
 
Upvote 0 Downvote
Jackpot!

Thanks a lot Dave, I really appreciate all your help on this!

:)

BTW, I don't know how you didn't kick my butt due to pure frustration.
 
Upvote 0 Downvote
Not a problem! Sometimes it feels like there's an unwritten code that when you start helping someone, you follow it through to the end! I'm just glad we managed to do it in a day! :)

--Dave
 
Upvote 0 Downvote
Argh!
Okay I just realized this while tweaking something...
the fields that build the query (the hidden fields with the date) are now locked in with yesterdays date :-/
 
Upvote 0 Downvote
Do you mean s_yr, etc.?

Would you like them to update when the user clicks on one of the dates on the calendar?

It's do-able if you feel comfortable changing acecalendar.js.

Find this in acecalendar.js:

Code: 
this.changeDay=function(str){var day=this.parseDay(str);if(day!=0){this.resetDay();this.oDate.setDate(day);this.displayDay();this.setAction();}};

...then add the bold code, below...

Code: 
this.changeDay=function(str){var day=this.parseDay(str);if(day!=0){this.resetDay();this.oDate.setDate(day);this.displayDay();this.setAction();} [b]document.sample.s_dt.value=day; //NOTE 1[/b]};

Then find...

Code: 
this.changeDate=function(){...

and add this before the closing curly-brace:

Code: 
if(document.sample.s_yr) [b]//NOTE 2[/b]
{
 var month = parseInt(mo) + 1;
 if(month < 10)
  month = '0' + month; //concatenates a '0' on the beginning

 [b]//NOTE 3[/b]
 document.sample.s_dt.value = oDate.getDate();
 document.sample.s_mo.value = month;
 document.sample.s_yr.value = oDate.getFullYear();
}

The closing-curly brace you're looking for, by the way, is immediately before "this.changeYear=function(yr)". I point that out because the format of acecalendar.js (in the editor I opened it) is not very user-friendly!

It took me a little trial and error to get this, so here is some info. to correspond to the NOTEs I added into the comments, above to explain:

NOTE 1: You should be able to see what I'm doing there.

NOTE 2: this if-statement added because this function is called as the page is being drawn. I found that s_yr, etc. hadn't been drawn by this point, so I was getting 'not found'-style errors. Since our fields-of-interest are being populated when the page loads anyway, they don't need to be populated here, so the if-statement allows the following lines to be skipped as the page is being drawn from scratch.

NOTE 3: all three fields are updated whenever ANY of the drop-downs (for month OR year) are changed. The reason for this is two-fold: (1) the function is called regardless of which drop-down is changed; and (2) even though it will be the month or year that is changed, the day MIGHT change under certain circumstances. For example, if you have 2/29/2000 selected and you change the year to 2001, then acecalendar.js knows there is no 2/29/2001 (2001 not being a leap year), so it changes the selected day to the first day of the month (thus creating a need to update the s_dt field).

Can you get it to work for you?

--Dave
 
Upvote 0 Downvote
P.S., you might consider setting the fields to disabled as well, so the user doesn't think he/she can edit s_yr, etc. and have the change be reflected on the calendar.

--Dave
 
Upvote 0 Downvote
who da man?
Dave is the man.
Totally worked even with that nasty (un)formatted .js file.
Those text fields, s_dt, etc are normally hidden so users don't even have the option of populating them - I did this and used the calendar because I figured it'd be easier to ignore the entire validation/date formatting issue when going into our DB and just use a calendar to populate the form in the correct format (which i thought would be a little simpler than it turned out to be => )

The one problem I did discover however, since it is the first of the month, is that the calendar/text fields default to the last day of the current month...ie, since today is the first it defaults me to July 30th - however this was easily solved by adding "mth=this.oDate.getMonth()-1" to the acecalendar.js file and then adding an ASP if/else condition to check if it's the first of the month. if it is - it loads acecalendarfirstday.js (which has the modification above) and else, it loads acecalendar.js - seems to work without a hitch and I can't think of any reason it wouldnt - can you?

Once again - thanks for all your help on this - you've got a bunch of good karma coming your way.
 
Upvote 0 Downvote
'glad it works!

I think I left a minor bug in the code which you noticed because of the fact that today is the 1st.

Instead of:
Code: 
oCal_2.display(yesterday.getYear(), aMonths[yesterday.getMonth()], yesterday.getDate());

Use:
Code: 
oCal_2.display(yesterday.getYear(), aMonths[yesterday.getMonth()[b]-1[/b]], yesterday.getDate());

Actually, you can probably just write:

Code: 
oCal_2.display(yesterday.getYear(), [b]yesterday.getMonth()[/b], yesterday.getDate());

I think your attempt to fix this might work for today, but won't work for tomorrow when you open the calendar and it says "AUGUST 2"!

The reason for this bug/fix is that while yesterday.getMonth() correctly gets the month for June, your array, aMonths[] already corrects for the fact that .getMonth() is a zero-based function (returning 5 for June, for example) and we end up sending '06' (the fifth index of aMonths[]) which is later (in acecalendar's display function) regarded as July.

Undo the fixes you made and make this little fix.

Have a splendiforous day!

--Dave
 
Upvote 0 Downvote
hey hey...
I'd much rather use your javascript method (which i did) however I do think the ASP method would have worked.

all i did was:

Code: 
dim FirstDay 
FirstDay = Day(date) 'check if the day is the first 
If Firstday = 1 then
%> 
<!--<script type="text/javascript" language="JavaScript1.2" src="acecalendarfirstday.js"></script>-->
<%else%>
<script type="text/javascript" language="JavaScript1.2" src="acecalendar.js"></script>
<%end if%>

day(date) just returns the number day in the month it is...so the first would always be the first, and if not it loaded the other .js

But hey, who cares.hehe..thanks again man.
 
Upvote 0 Downvote
No, seriously, you mistook the problem you saw as being specific to the first day of the month.

In truth, every day of the month would have shown the wrong month.

Tomorrow, it would have shown as August.

I guess it's not an issue anymore though, so...

Take care!

--Dave
 
Upvote 0 Downvote
hmm..I guess my question is why would it have been august tomorrow, or - why was it June yesterday?
Program and calendar works fine so it isn't really important but I am kind of curious.

hehe..not important anyway. enjoy!
 
Upvote 0 Downvote
Left unchanged, today my javascript correctly determined that yesterday was still June. In so doing, it selected the aMonths[5]/'06'/the 6th index from aMonths. Passing this to acecalender's display-function ends up (downstream) passing 6 as the argument in setMonth(). Since JavaScript starts counting months at 0, setting it to 6 is setting it to the 7th month: July.

Tomorrow, my javascript would have sent '07' (the 8th index in aMonths), which, in turn would be the argument in setMonth, causing a return of August.

The big question is what really happened yesterday? Why did it seem to work? I think it's possible that it didn't, but we didn't notice that the month was off since we were so busy looking at the day.

Anyway...

Happy, July! :)

--Dave
 
Upvote 0 Downvote
The big question is what really happened yesterday? Why did it seem to work? I think it's possible that it didn't, but we didn't notice that the month was off since we were so busy looking at the day."

very possible...

-adores the js calendar-
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
915
xwb
xwb
jimoo
  • Locked
  • Question
How execute JS
Replies
3
Views
1K
xwb
xwb
penguinspeaks
  • Locked
  • Question
How do I pass a classic asp variable to JS
Replies
1
Views
1K
xwb
xwb
rogerte
  • Locked
  • Question
Code that works on Windows, Android and Iphone
Replies
0
Views
732
rogerte
rogerte
leifoet
  • Locked
  • Question
How to combine JS and ASP ?
Replies
5
Views
433
feherke
feherke

Part and Inventory Search

Sponsor

Back
Top