Drop Down Menu Year Select

Help with installation and general calendar setttings

Drop Down Menu Year Select

Postby makorebijio » Fri Apr 29, 2011 1:53 am

Hello,

I love this AJAX calendar and I find that it is extremely easy to use and well designed.

My question is, how do I go about creating a DROP DOWN MENU to select the YEAR I want to display?

I would like to put this menu next to the Lang. selection, but I am not sure how to do that in AJAX.

Thanks
makorebijio
 
Posts: 2
Joined: Fri Apr 29, 2011 1:50 am

Re: Drop Down Menu Year Select

Postby chris » Fri Apr 29, 2011 10:17 am

Hi,
I'm glad that you like the calendar :)

OK, I like a challenge and I think that this could be a useful addition to the calendar so I have given this a go...

First create your list of years something like this (you can of course do this part however you like):
Code: Select all
<select id="jump_year">
   ';
   for($year=date('Y');$year<=2020; ++$year){
      echo '<option value="'.$year.'">'.$year.'</option>';
   }
   echo '
</select>

Make sure that the "id" of the select list is defined as "jump_year".

Second add this code to the ac-includes/js/mootools-cal-public.js file at the end of the window.addEvent block:
Code: Select all
$('jump_year').addEvent('change',function(){
   var new_year=parseFloat(this.value);
   //   get each calendar and calculate new date
   $$('div.load_cal').each(function(el){
      var this_date=el.getFirst().id;
      var data=this_date.split('_');         
      //   convert to numeric
      new_month   = parseFloat(data[0]);   
      load_calendar(el,new_month,new_year);
      if(new_month==12){
         //   add 1 year
         new_year=(new_year+1);
      }
   });
});

so the resulting block will look like this:
Code: Select all
window.addEvent('domready', function() {
   //   load initial calendars
   if($$('.load_cal')){
      $$('.load_cal').each(function(el){
         var this_date=el.get('id');
         var data=this_date.split('_');
         load_calendar(el,data[0],data[1]);
      });
      //   once drawn, make calendars clickable
      activate_dates();
      //   calendar next and back buttons
      calendar_nav();
   }   
   
   $('jump_year').addEvent('change',function(){
      var new_year=parseFloat(this.value);
      //   get each calendar and calculate new date
      $$('div.load_cal').each(function(el){
         var this_date=el.getFirst().id;
         var data=this_date.split('_');      
         //   convert to numeric
         new_month   = parseFloat(data[0]);
         load_calendar(el,new_month,new_year);
         if(new_month==12){
            //   add 1 year
            new_year=(new_year+1);
         }
      });
   });
   
});


Give that a go and let me know how it goes or if you run into any problems :)

Chris
User avatar
chris
Site Admin
 
Posts: 1088
Joined: Mon Dec 17, 2007 7:42 pm
Location: Málaga, Spain

Re: Drop Down Menu Year Select

Postby makorebijio » Sat Apr 30, 2011 8:36 pm

Hi,

Not only is your calendar amazing but the support you give with it is priceless.
Having said that, there is a bug I found with your code for the jump year.
I implemented it and it works perfectly, i get my drop down menu and I can select a year I want and the calendar loads it.

Bug #1 - Say I am in year 2001 then I use the arrows to go to year 2002, the drop down year select does not adjust it's year to reflect 2002.

Bug #2 - Say I am in year 2001, and I hit F5 (refresh) it will refresh the calendar to today's year 2011.

Question (just because you like a challenge):

Say I have 5 (different) separate calendars and I want to display all five calendars at once and only months 1-2-3.....
So my window would be:
Calendar #1 - Jan Feb Mar
Calendar #2 - Jan Feb Mar
Calendar #3 - Jan Feb Mar
Calendar #4 - Jan Feb Mar
Calendar #5 - Jan Feb Mar

Is that an option you ever considered implementing?
makorebijio
 
Posts: 2
Joined: Fri Apr 29, 2011 1:50 am

Re: Drop Down Menu Year Select

Postby chris » Sat Apr 30, 2011 8:50 pm

Hi, thanks for your comments :)

Bug #1 - Say I am in year 2001 then I use the arrows to go to year 2002, the drop down year select does not adjust it's year to reflect 2002.

OK, I see what you are saying and you are right.
However that was just a quick fix for a specific request that I published as I thought it might be interesting to others like yourself. Ironically the user who made the original request has not yet even read my reply, though no doubt they have their reasons ;) . <rant>I am always surprised by the amount of people who don't come back and see the reply to their resquest </rant>
If I get a chance I will take a look at this, I shouldn't think that it should be too hard to implement.

Bug #2 - Say I am in year 2001, and I hit F5 (refresh) it will refresh the calendar to today's year 2011.

This is slightly different and I would argue that it is not really a bug. When you change the year it doesn't "post" a form rather it updates the calendar via JavaScript (AJAX). So, to get the page to detect this change and "remember" it on page refresh would be pretty tricky if not impossible.

Finally as to your request....
Showing multiple calendars *is* possible but requires various core code changes both to the php and to the JavaScript. However this is the sort of thing that I do as paid customizations for clients - got to make some money out of this somehow ;)
Here is one I did for a client just last week (the web is not finished yet):
http://www.willowbrookcabins.com/cabin_availability.php

Thanks again,

Chris
User avatar
chris
Site Admin
 
Posts: 1088
Joined: Mon Dec 17, 2007 7:42 pm
Location: Málaga, Spain


Return to Support

Who is online

Users browsing this forum: No registered users and 2 guests

cron