Loading ...
Sorry, an error occurred while loading the content.
 

Re: [ydn-javascript] Re: Calendar - Select range of dates

Expand Messages
  • dav.glass@yahoo.com
    getSelectedDates returns an array of JavaScript Date objects. Here is a general parsing idea: var calDate = cal1.getSelectedDates(); var calDateStr = ; for
    Message 1 of 4 , Sep 29, 2006
      getSelectedDates returns an array of JavaScript Date objects.
      Here is a general parsing idea:
      var calDate = cal1.getSelectedDates();
      var calDateStr = '';
      for (var i = 0; i < calDate.length; i++) {
      calDateStr = calDateStr + ' ' +
      (calDate[i].getMonth() + 1) +
      '/' + calDate[i].getDate() +
      '/' + calDate[i].getFullYear(); // This will format the date as mm/dd/YYYY
      }
      FORM_FIELD.value = calDateStr; //Set the form field value to the resulting string

      You can see an example here:
      http://blog.davglass.com/files/yui/cal2/
       
      Hope that helps...

      Dav Glass
      dav.glass@...
      davglass.com
      618.694.3476

      + Windows: n. - The most successful computer virus, ever. +
      + A computer without a Microsoft operating system is like a dog
      without bricks tied to its head +
      + A Microsoft Certified Systems Engineer is to computing what a
      McDonalds Certified Food Specialist is to fine cuisine +


      ----- Original Message ----
      From: jfasaldarriaga <jfasaldarriaga@...>
      To: ydn-javascript@yahoogroups.com
      Sent: Friday, September 29, 2006 7:36:06 AM
      Subject: [ydn-javascript] Re: Calendar - Select range of dates

      --- In ydn-javascript@ yahoogroups. com, "jfasaldarriaga"
      <jfasaldarriaga@ ...> wrote:

      >
      > Hi :) Im trying to do this, when I write in a text input whit an
      > onChange event this value will be renderer on the calendar, thats
      > because I need insert ranges of dates in the calendar but all this
      > range needs to be in normal dates, 01/01/2006-01/ 20/2006 ->
      > 01/01/2006, 01/02/2006 ...
      >
      > This is my code:
      >
      > <html>
      > <head>
      > <script type="text/javascri pt" src="build/yahoo/ yahoo.js" ></script>
      > <script type="text/javascri pt" src="build/event/ event.js" ></script>
      > <script type="text/javascri pt" src="build/dom/ dom.js">< /script>
      > <script type="text/javascri pt"
      src="build/calendar /calendar. js"></script>
      > <link type="text/css" rel="stylesheet"
      > href="build/ calendar/ assets/calendar. css">
      > <script language="javascrip t">
      > var cal1;
      > function init() {
      > cal1 = new YAHOO.widget. Calendar( "cal1","cal1Cont ainer");
      > cal1.Options. MULTI_SELECT = true;
      > /*var customConfig = function() {
      > this.Options. MULTI_SELECT = true;
      > }
      >
      > cal1.setChildFuncti on("customConfig ", customConfig) ;
      > cal1.callChildFunct ion("customConfi g");*/
      >
      > cal1.render( );
      > }
      > </script>
      > </head>
      > <body onload="init( )">
      > <input type="text" name="program_ dates" id="program_ dates"
      > onChange="selectDat es( this.value );"/>
      > <script type="text/javascri pt">
      > function selectDates( value )
      > {
      > alert( "Value: " + value );
      > cal1.addRenderer( value, init );
      > }
      > </script>
      > <div id="cal1Container" ></div>
      > </body>
      > </html>
      >
      > Any help will be apreciated. Thx.
      >

      Well, I guess my problem is resolved, I made this:

      <input type="text" name="program_ dates" id="program_ dates"
      onChange="selectDat es( this.value );"/>
      <script type="text/javascri pt">
      function selectDates( value )
      {
      alert( "Value: " + value );
      cal1.select( value );
      cal1.render( );
      alert( "Dates: " + cal1.getSelectedDat es() );
      }
      </script>

      So, now all the dates on the input were selected by the calendar, now
      I need to return this selected dates with this format: MM/DD/YYYY,
      somebody know how to do this ?

      Thx.


    • jfasaldarriaga
      Thx for your answer, it help me a lot :), now I set up the Calendar2Up, but when I made clear() I got the same month on the two calendar panels, it is a bug ?
      Message 2 of 4 , Sep 29, 2006
        Thx for your answer, it help me a lot :), now I set up the
        Calendar2Up, but when I made clear() I got the same month on the two
        calendar panels, it is a bug ?

        This is the code:

        <input type="button" value="Deselect All" name="deselect"
        style="margin-left: 10px;" onClick="deSelect();" />

        <script type="text/javascript">
        function deSelect()
        {
        cal1.clear();
        //cal1.render();
        }
        </script>

        --- In ydn-javascript@yahoogroups.com, <dav.glass@...> wrote:
        >
        > getSelectedDates returns an array of JavaScript Date objects.
        > Here is a general parsing idea:
        > var calDate = cal1.getSelectedDates();
        > var calDateStr = '';
        > for (var i = 0; i < calDate.length; i++) {
        > calDateStr = calDateStr + ' ' +
        > (calDate[i].getMonth() + 1) +
        > '/' + calDate[i].getDate() +
        > '/' + calDate[i].getFullYear(); // This will format the date as
        mm/dd/YYYY
        > }
        > FORM_FIELD.value = calDateStr; //Set the form field value to the
        resulting string
        >
        > You can see an example here:
        > http://blog.davglass.com/files/yui/cal2/
        >
        > Hope that helps...
        >
        >
        > Dav Glass
        > dav.glass@...
        > davglass.com
        > 618.694.3476
        >
        > + Windows: n. - The most successful computer virus, ever. +
        > + A computer without a Microsoft operating system is like a dog
        > without bricks tied to its head +
        > + A Microsoft Certified Systems Engineer is to computing what a
        > McDonalds Certified Food Specialist is to fine cuisine +
        >
        > ----- Original Message ----
        > From: jfasaldarriaga <jfasaldarriaga@...>
        > To: ydn-javascript@yahoogroups.com
        > Sent: Friday, September 29, 2006 7:36:06 AM
        > Subject: [ydn-javascript] Re: Calendar - Select range of dates
        >
        > --- In ydn-javascript@ yahoogroups. com,
        "jfasaldarriaga"
        > <jfasaldarriaga@ ...> wrote:
        > >
        > > Hi :) Im trying to do this, when I write in a text input whit an
        > > onChange event this value will be renderer on the calendar, thats
        > > because I need insert ranges of dates in the calendar but all this
        > > range needs to be in normal dates, 01/01/2006-01/ 20/2006 ->
        > > 01/01/2006, 01/02/2006 ...
        > >
        > > This is my code:
        > >
        > > <html>
        > > <head>
        > > <script type="text/javascri pt" src="build/yahoo/ yahoo.js"
        ></script>
        > > <script type="text/javascri pt" src="build/event/ event.js"
        ></script>
        > > <script type="text/javascri pt" src="build/dom/ dom.js">< /script>
        > > <script type="text/javascri pt"
        > src="build/calendar /calendar. js"></script>
        > > <link type="text/css" rel="stylesheet"
        > > href="build/ calendar/ assets/calendar. css">
        > > <script language="javascrip t">
        > > var cal1;
        > > function init() {
        > > cal1 = new YAHOO.widget. Calendar( "cal1","cal1Cont ainer");
        > > cal1.Options. MULTI_SELECT = true;
        > > /*var customConfig = function() {
        > > this.Options. MULTI_SELECT = true;
        > > }
        > >
        > > cal1.setChildFuncti on("customConfig ", customConfig) ;
        > > cal1.callChildFunct ion("customConfi g");*/
        > >
        > > cal1.render( );
        > > }
        > > </script>
        > > </head>
        > > <body onload="init( )">
        > > <input type="text" name="program_ dates" id="program_ dates"
        > > onChange="selectDat es( this.value );"/>
        > > <script type="text/javascri pt">
        > > function selectDates( value )
        > > {
        > > alert( "Value: " + value );
        > > cal1.addRenderer( value, init );
        > > }
        > > </script>
        > > <div id="cal1Container" ></div>
        > > </body>
        > > </html>
        > >
        > > Any help will be apreciated. Thx.
        > >
        >
        > Well, I guess my problem is resolved, I made this:
        >
        > <input type="text" name="program_ dates" id="program_ dates"
        > onChange="selectDat es( this.value );"/>
        > <script type="text/javascri pt">
        > function selectDates( value )
        > {
        > alert( "Value: " + value );
        > cal1.select( value );
        > cal1.render( );
        > alert( "Dates: " + cal1.getSelectedDat es() );
        > }
        > </script>
        >
        > So, now all the dates on the input were selected by the calendar, now
        > I need to return this selected dates with this format: MM/DD/YYYY,
        > somebody know how to do this ?
        >
        > Thx.
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.