See also:
http://www.clientcide.com/wiki/cnet-libraries/09-forms/02-datepicker
http://www.clientcide.com/wiki/cnet-libraries/09-forms/03-datepicker.extras

On Tue, Dec 16, 2008 at 6:22 AM, rpflo (via Nabble) <
[email protected]<ml-user%[email protected]>
> wrote:

>
> Different interface, not sure if you need everything in different
> fields, but you can always parse the values server side.
>
> http://www.electricprism.com/aeron/calendar/
>
>
> On Dec 16, 7:04 am, itaymoav 
> <itay.malimo...@...<http://n2.nabble.com/user/SendEmail.jtp?type=node&node=1662977&i=0>>
> wrote:
> > Well,
> >
> > I have scrunch some thing, this assumes you have either one OR two
> > dates (should be fairly easy to make it handle more). Each date is
> > represented by 3 drop downs month,day, year.
> > HTML:
> > FROM
> > <select name="month" id="month">...</select>
> > <select name="day" id="day">...</select>
> > <select name="year" id="year">...</select>
> > TO
> > <select name="month1" id="month1">...</select>
> > <select name="day1" id="day1">...</select>
> > <select name="year1" id="year1">...</select>
> >
> > CODE YOU NEED TO ADD:
> > <script type='text/javascript'>
> >         var MyDatesValidator=new DateValidator
> > ('month','day','year','month1','day1','year1');
> > </script>
> >
> > The class:
> > var DateValidator=new Class({
> >         isTimeFrame: true,
> >         month: null,
> >         day: null,
> >         year: null,
> >         month1: null,
> >         day1 :null,
> >         year1: null,
> >         initialize: function(month,day,year,month1,day1,year1) {
> >                 this.month=$(month);
> >                 this.day=$(day);
> >                 this.year=$(year);
> >                 if(!month1) {
> >                         this.isTimeFrame=false;
> >                 }else{
> >                         this.month1=$(month1);
> >                         this.day1=$(day1);
> >                         this.year1=$(year1);
> >                 }
> >                 this.attachEvents();
> >                 //fire event to see the correct number of days is shown.
> WILL GO
> > AWAY ONCE I BOUNDLE IT ALL UNDER ONE PACKAGE!!!
> >                 this.month.fireEvent('change');
> >                 this.month1.fireEvent('change');
> >         },//EOF constructor.
> >
> >         //modify the relevant days drop down to show the correct number
> of
> > days.
> >         modifyActual: function(number_of_days,Elm){
> >                 var old_selected_idx=Elm.selectedIndex;
> >                 Elm.innerHTML='';
> >                 for(var i=0;i<number_of_days;i++)
> >                 {
> >                         var Option=new Element('option',{value:(i+1)});
> >                         Option.appendText(i+1);
> >                         Elm.adopt(Option);
> >                 }
> >                 if(old_selected_idx<number_of_days)
> >                 {
> >                         Elm.selectedIndex=old_selected_idx;
> >                 }else{
> >                         Elm.selectedIndex=number_of_days-1;
> >                 }
> >         },
> >
> >         modify: function(){
> >                 var MyDate=new Date(this.year.options
> > [this.year.selectedIndex].value*1,this.month.selectedIndex+1,0);
> >                 this.modifyActual(MyDate.getDate(),this.day);
> >         },
> >         modify1: function(){
> >                 var MyDate=new Date(this.year1.options
> > [this.year1.selectedIndex].value*1,this.month1.selectedIndex+1,0);
> >                 this.modifyActual(MyDate.getDate(),this.day1);
> >         },
> >         attachEvents: function(){
> >                 //modify days numbers
> >                 this.month.addEvent('change',this.modify.bind(this));
> >                 this.year.addEvent('change',this.modify.bind(this));
> >                 if(this.isTimeFrame){
> >
> this.month1.addEvent('change',this.modify1.bind(this));
> >
> this.year1.addEvent('change',this.modify1.bind(this));
> >
> >                         //attach the validate date range event (from is
> lower then to)
> >                         var Form=this.day.getParent('form');
> >                         Form.addEvent('submit',this.validate.bind(this));
>
> >                 }
> >         },
> >
> >         validate: function(e){
> >                 //get time stamps from both dates
> >                 var time_stamp1=new Date(this.year.options
> > [this.year.selectedIndex].value*1,this.month.selectedIndex
> > +1,this.day.selectedIndex+1).getTime();
> >                 var time_stamp2=new Date(this.year1.options
> > [this.year1.selectedIndex].value*1,this.month1.selectedIndex
> > +1,this.day1.selectedIndex+1).getTime();
> >                 if(time_stamp2<time_stamp1)
> >                 {
> >                         e.stop();
> >                         alert('From has to be before To');
> >                 }
> >         }
> >
> >
> >
> > });
>
>
> ------------------------------
>  View message @
> http://n2.nabble.com/In-search-of-a-plugin-classs-of-a-simple-date-dropdown-tp1658285p1662977.html
> To start a new topic under MooTools Users, email
> [email protected]<ml-node%[email protected]>
> To unsubscribe from MooTools Users, click here< (link removed) >.
>
>
>


-----
The MooTools Tutorial:  http://www.mootorial.com www.mootorial.com 
Clientcide:  http://www.clientcide.com www.clientcide.com 
-- 
View this message in context: 
http://n2.nabble.com/In-search-of-a-plugin-classs-of-a-simple-date-dropdown-tp1658285p1664270.html
Sent from the MooTools Users mailing list archive at Nabble.com.

Reply via email to