can you show me the code? what i did is a sample lay out using tables. but it is not interacting, the months cannot be move and the present date is not highlighted..
This is a JavaScript Calendar class that I wrote. Here you can see it in action. The HTML is output from the class using its toString method, which can be modified to suit your needs. The styling is all done with CSS, though.
I've uploaded a zip with all the files needed (.js, .css and .png's) also there is a html file which demonstrates it. Should give you a good start.
The html file should explain its self quite well but it uses a wrapper function called my_UseCalendar() which isn't required but was useful for what I was using it for.
By including the .js file you get a object named PB_Calendar. When you want to show the calendar use:
displayObj should be the object to display the result (an input box). displayDF is the display format for the result (see bellow for possible values). hiddenObj is the same as displayObj but allows you to have a different format (if you dont need it pass null) hiddenDF is the format for the second object. positionObj is a object that the calendar should be displayed based on. positionTopOffset is how far vertically to offset the calendar from positionObj. positionLeftOffset is how far horizontally to offset the calendar from positionObj. limitStart is either -1, 0 or a date in dd/mm/yyyy format. -1 means no limit, 0 means today. limitEnd is either -1, 0 or a date in dd/mm/yyyy format. -1 means no limit, 0 means today.
Supported Date Formats: dd/mm/yyyy
dd-mm-yyyy
d mmmm yyyy
dd mmmm yyyy
yyyy-mm-ddT00:00
Notice that mmmm pulls the name of the month from PB_Calendar.cal_MonthsFormat[] so if you were to use it in another language you can replace the values in the array.
Same goes for .cal_MonthsDisplay[] (Month name on the calendar box) & .cal_DaysHeader[] (Days of the week headers).
@Kows: I looked at your calendar there but how does it select the dates?
Last edited by PBertie; Aug 19th, 2011 at 03:48 PM.
Reason: Missed off date formats
@Kows: I looked at your calendar there but how does it select the dates?
You don't. No where in this post does the author say he wants to be able to select a date. He wanted to be able to change months and have the current date selected, which is exactly what my Calendar class allows.
You don't. No where in this post does the author say he wants to be able to select a date. He wanted to be able to change months and have the current date selected, which is exactly what my Calendar class allows.
Sorry my mistake. Out of interest what sort of situations do you use your calendar in?
Sorry my mistake. Out of interest what sort of situations do you use your calendar in?
I don't at all, actually. It was just me playing around with object-oriented programming concepts in JavaScript. I have a few other examples, including a form validator, an image gallery, a simple game, and a wrapper class for AJAX requests.
what's the problem with this codes? the calendar is not displayed in my site. i tried not to add this one in my site an create a html file and its working but after i insert this one, it no longer can be seen.
Well hopefully there's more than just that one block of script on your page if you expect that to work. Have you downloaded the latest release package from that site? It has a demo HTML file in it - take a look at that. Make sure you've included all necessary JS files.
Also note that that particular calendar script is free for non-commercial usage only. Also "DHTML."