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

Yahoo Calendar UI (JavaScript): Select date opens a blank page

Expand Messages
  • seasonedgeek
    A Yahoo Calendar widget is displayed on my page. When I click on a numbered day, the calendar displays the same behavior as the Yahoo default example and opens
    Message 1 of 8 , Apr 27, 2006
    • 0 Attachment
      A Yahoo Calendar widget is displayed on my page. When I click on a
      numbered day, the calendar displays the same behavior as the Yahoo
      default example and opens a new blank page with an address of
      javascript:void(null);

      Is this because of the class object? See snippet below. I don't
      define a <FORM></FORM> in my HTML.

      Any help or observation is most welcomed!

      --Tom.

      var DateWatcher = Class.create();
      DateWatcher.prototype = {
      initialize: function(dateField, calendarImage, calendarLayer) {
      this.dateField = $(dateField);
      this.calendarImage = $(calendarImage);
      this.calendarLayer = $(calendarLayer);
      this.calendar = null;
      //
      // Attach Event Listeners
      this.calendarImage.onclick =
      this.showCalendar.bindAsEventListener(this);
      },

      showCalendar: function() {
      if (this.calendarImage.src.indexOf('x') > -1)
      return false;

      //
      // Create calendar
      this.calendar =
      new YAHOO.widget.Calendar("cal1","cal1Container");
      this.calendar.onclick =
      this.getCalendarDate.bindAsEventListener(this);
      this.calendar.minDate =
      YAHOO.widget.DateMath.add(new Date(),
      YAHOO.widget.DateMath.DAY, 1);
      this.calendar.render();
      //
      // Use DIV to simulates popup calendar
      // DIV ID="cal1Container"
      this.calendarLayer.style.display = 'block';
      this.calendarImage.src = 'gifs/calx.gif';
      return false;
      }
      };
    • Steven Peterson
      Tom, Which browser are you using where the default calendar example is opening a new window when you click a date? Thanks! Steven Peterson Web Developer,
      Message 2 of 8 , Apr 27, 2006
      • 0 Attachment

        Tom,

         

        Which browser are you using where the default calendar example is opening a new window when you click a date?

         

        Thanks!

         

        Steven Peterson

        Web Developer, Platform Engineering

        Yahoo!


        From: ydn-javascript@yahoogroups.com [mailto:ydn-javascript@yahoogroups.com] On Behalf Of seasonedgeek
        Sent: Thursday, April 27, 2006 9:26 AM
        To: ydn-javascript@yahoogroups.com
        Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select date opens a blank page

         

        A Yahoo Calendar widget is displayed on my page. When I click on a
        numbered day, the calendar displays the same behavior as the Yahoo
        default example and opens a new blank page with an address of
        javascript:void(null);

        Is this because of the class object? See snippet below. I don't
        define a <FORM></FORM> in my HTML.

        Any help or observation is most welcomed!

        --Tom.

        var DateWatcher = Class.create();
        DateWatcher.prototype = {
        initialize: function(dateField, calendarImage, calendarLayer) {
              this.dateField = $(dateField);
              this.calendarImage = $(calendarImage);
              this.calendarLayer = $(calendarLayer);
              this.calendar = null;
              //
              //      Attach Event Listeners
              this.calendarImage.onclick =
                     this.showCalendar.bindAsEventListener(this);
        },

        showCalendar: function() {
              if (this.calendarImage.src.indexOf('x') > -1)
              return false;

              //
              // Create calendar
              this.calendar =
                    new YAHOO.widget.Calendar("cal1","cal1Container");
              this.calendar.onclick =
                    this.getCalendarDate.bindAsEventListener(this);
              this.calendar.minDate =
                    YAHOO.widget.DateMath.add(new Date(),
                        YAHOO.widget.DateMath.DAY, 1);
              this.calendar.render();
              //
              // Use DIV to simulates popup calendar
                // DIV ID="cal1Container"
              this.calendarLayer.style.display = 'block';
              this.calendarImage.src = 'gifs/calx.gif';
              return false;
            }
        };





      • seasonedgeek
        Steve, I m using IE 6 SP 1. --Tom. ... opening a ... javascript@yahoogroups.com] ... date opens ... subject=Unsubscribe
        Message 3 of 8 , Apr 27, 2006
        • 0 Attachment
          Steve,

          I'm using IE 6 SP 1.

          --Tom.

          --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
          <peterson@...> wrote:
          >
          > Tom,
          >
          >
          >
          > Which browser are you using where the default calendar example is
          opening a
          > new window when you click a date?
          >
          >
          >
          > Thanks!
          >
          >
          >
          > Steven Peterson
          >
          > Web Developer, Platform Engineering
          >
          > Yahoo!
          >
          > _____
          >
          > From: ydn-javascript@yahoogroups.com [mailto:ydn-
          javascript@yahoogroups.com]
          > On Behalf Of seasonedgeek
          > Sent: Thursday, April 27, 2006 9:26 AM
          > To: ydn-javascript@yahoogroups.com
          > Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select
          date opens
          > a blank page
          >
          >
          >
          > A Yahoo Calendar widget is displayed on my page. When I click on a
          > numbered day, the calendar displays the same behavior as the Yahoo
          > default example and opens a new blank page with an address of
          > javascript:void(null);
          >
          > Is this because of the class object? See snippet below. I don't
          > define a <FORM></FORM> in my HTML.
          >
          > Any help or observation is most welcomed!
          >
          > --Tom.
          >
          > var DateWatcher = Class.create();
          > DateWatcher.prototype = {
          > initialize: function(dateField, calendarImage, calendarLayer) {
          > this.dateField = $(dateField);
          > this.calendarImage = $(calendarImage);
          > this.calendarLayer = $(calendarLayer);
          > this.calendar = null;
          > //
          > // Attach Event Listeners
          > this.calendarImage.onclick =
          > this.showCalendar.bindAsEventListener(this);
          > },
          >
          > showCalendar: function() {
          > if (this.calendarImage.src.indexOf('x') > -1)
          > return false;
          >
          > //
          > // Create calendar
          > this.calendar =
          > new YAHOO.widget.Calendar("cal1","cal1Container");
          > this.calendar.onclick =
          > this.getCalendarDate.bindAsEventListener(this);
          > this.calendar.minDate =
          > YAHOO.widget.DateMath.add(new Date(),
          > YAHOO.widget.DateMath.DAY, 1);
          > this.calendar.render();
          > //
          > // Use DIV to simulates popup calendar
          > // DIV ID="cal1Container"
          > this.calendarLayer.style.display = 'block';
          > this.calendarImage.src = 'gifs/calx.gif';
          > return false;
          > }
          > };
          >
          >
          >
          >
          >
          >
          >
          > _____
          >
          > YAHOO! GROUPS LINKS
          >
          >
          >
          > * Visit your group "ydn-javascript
          > <http://groups.yahoo.com/group/ydn-javascript> " on the web.
          >
          > * To unsubscribe from this group, send an email to:
          > ydn-javascript-unsubscribe@yahoogroups.com
          > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
          subject=Unsubscribe>
          >
          > * Your use of Yahoo! Groups is subject to the Yahoo!
          > <http://docs.yahoo.com/info/terms/> Terms of Service.
          >
          >
          >
          > _____
          >
        • Steven Peterson
          I haven t been able to re-create this issue. Does this occur on the example that s linked from the YDN site? If so, it s possible that there may be an issue
          Message 4 of 8 , Apr 27, 2006
          • 0 Attachment

            I haven’t been able to re-create this issue. Does this occur on the example that’s linked from the YDN site? If so, it’s possible that there may be an issue with the way that your browser installation is handling javascript links.

             

            Steven Peterson

            Web Developer, Platform Engineering

            Yahoo!


            From: ydn-javascript@yahoogroups.com [mailto:ydn-javascript@yahoogroups.com] On Behalf Of seasonedgeek
            Sent: Thursday, April 27, 2006 2:20 PM
            To: ydn-javascript@yahoogroups.com
            Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript): Select date opens a blank page

             

            Steve,

            I'm using IE 6 SP 1.

            --Tom.

            --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
            <peterson@...> wrote:

            >
            > Tom,
            >

            >
            > Which browser are you using where the default calendar example is
            opening a
            > new window when you click a date?
            >

            >
            > Thanks!
            >

            >
            > Steven Peterson
            >
            > Web Developer, Platform Engineering
            >
            > Yahoo!
            >
            >   _____ 
            >
            > From: ydn-javascript@yahoogroups.com [mailto:ydn-
            javascript@yahoogroups.com]
            > On Behalf Of seasonedgeek
            > Sent: Thursday, April 27, 2006 9:26 AM
            > To: ydn-javascript@yahoogroups.com
            > Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select
            date opens
            > a blank page
            >

            >
            > A Yahoo Calendar widget is displayed on my page. When I click on a
            > numbered day, the calendar displays the same behavior as the Yahoo
            > default example and opens a new blank page with an address of
            > javascript:void(null);
            >
            > Is this because of the class object? See snippet below. I don't
            > define a <FORM></FORM> in my HTML.
            >
            > Any help or observation is most welcomed!
            >
            > --Tom.
            >
            > var DateWatcher = Class.create();
            > DateWatcher.prototype = {
            > initialize: function(dateField, calendarImage, calendarLayer) {
            >       this.dateField = $(dateField);
            >       this.calendarImage = $(calendarImage);
            >       this.calendarLayer = $(calendarLayer);
            >       this.calendar = null;
            >       //
            >       //     
            Attach Event Listeners
            >       this.calendarImage.onclick =
            >             
            this.showCalendar.bindAsEventListener(this);
            > },
            >
            > showCalendar: function() {
            >       if
            (this.calendarImage.src.indexOf('x') > -1)
            >       return false;
            >
            >       //
            >       // Create calendar
            >       this.calendar =
            >            
            new YAHOO.widget.Calendar("cal1","cal1Container");
            >       this.calendar.onclick =
            >            
            this.getCalendarDate.bindAsEventListener(this);
            >       this.calendar.minDate =
            >            
            YAHOO.widget.DateMath.add(new Date(),
            >                
            YAHOO.widget.DateMath.DAY, 1);
            >       this.calendar.render();
            >       //
            >       // Use DIV to simulates popup calendar
            >         // DIV
            ID="cal1Container"
            >       this.calendarLayer.style.display =
            'block';
            >       this.calendarImage.src =
            'gifs/calx.gif';
            >       return false;
            >     }
            > };
            >
            >
            >
            >
            >
            >
            >
            >   _____ 
            >
            > YAHOO! GROUPS LINKS
            >

            >
            > *      Visit your group "ydn-javascript
            > <http://groups.yahoo.com/group/ydn-javascript>
            " on the web.
            >  
            > *      To unsubscribe from this group, send an
            email to:
            >  ydn-javascript-unsubscribe@yahoogroups.com
            > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
            subject=Unsubscribe>
            >  
            > *      Your use of Yahoo! Groups is subject to
            the Yahoo!
            > <http://docs.yahoo.com/info/terms/
            Terms of Service.
            >

            >
            >   _____
            >





          • seasonedgeek
            Steven, No, the issue does not occur on the default calendar example page that s linked to the YDN site. I created a page on my server that mirrors the
            Message 5 of 8 , Apr 28, 2006
            • 0 Attachment
              Steven,

              No, the issue does not occur on the default calendar example page
              that's linked to the YDN site. I created a page on my server that
              mirrors the behaviors of the YDN default calendar example page. When
              I run the YDN default page on my server as is (the YDN files and
              directories remain intact), the calendar widget works correctly.

              So, I got brave and I copied the calendar.js, dom.js, events.js and
              YAHOO.js files to my js directory, the calendar.css file to my css
              directory and the images to my images directories under my web app's
              root directory, as recommeded.

              I created several versions of my test page following the example laid
              out by the YDN default calendar page. All test versions define the
              calendar container as shown in the YDN example. All my test versions
              load a new page when clicking on a day cell or the previous/next
              month image.

              I found a workaround where I substitute, in renderCellDefault(), a
              <span name=cal1__2006_4_28>28</span> tag set instead of using the
              default <a href="javascript:void(null);" name=cal1__2006_4_28>28</a>
              tag set. I modified doSelectCell() and calendar.css to support this
              change. Now, all versions can select a new day cell without loading a
              new page.

              I attempted to apply the same solution to renderHeader() for the
              previous and next iamges. The results were a mixed bag. For now, I've
              reserved my changes in renderHeader().

              Version 1 is almost an exact replica of the YDN default calendar
              example with one exception: the init() function is called after
              testing to see if the document.readyState == complete. The calendar
              widget works when selecting day cells; it fails when attempting to
              move between months. The error message states that 'cal1' is
              undefined when calling either cal1.previousMonth() or
              cal1.nextMonth().

              Curious: the calendar.js documentation states that "cal1" is "the id
              of the table element that will represent the calendar widget".
              However, the actual code (snippet) displays:

              <div class=calordered id=cal1>
              <table class=calendar cellspacing=0>

              Version 2 attempts to embed the yahoo calendar widget in the class
              dateWatcher object. The Here, the calendar is displayed but the user
              cannot move between months. Again the error message states
              that 'cal1' is undefined as above.

              Any ideas, suggestions???

              Thanks,
              --Tom.

              --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
              <peterson@...> wrote:
              >
              > I haven't been able to re-create this issue. Does this occur on the
              example
              > that's linked from the YDN site? If so, it's possible that there
              may be an
              > issue with the way that your browser installation is handling
              javascript
              > links.
              >
              >
              >
              > Steven Peterson
              >
              > Web Developer, Platform Engineering
              >
              > Yahoo!
              >
              > _____
              >
              > From: ydn-javascript@yahoogroups.com [mailto:ydn-
              javascript@yahoogroups.com]
              > On Behalf Of seasonedgeek
              > Sent: Thursday, April 27, 2006 2:20 PM
              > To: ydn-javascript@yahoogroups.com
              > Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript):
              Select date
              > opens a blank page
              >
              >
              >
              > Steve,
              >
              > I'm using IE 6 SP 1.
              >
              > --Tom.
              >
              > --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
              > <peterson@> wrote:
              > >
              > > Tom,
              > >
              > >
              > >
              > > Which browser are you using where the default calendar example is
              > opening a
              > > new window when you click a date?
              > >
              > >
              > >
              > > Thanks!
              > >
              > >
              > >
              > > Steven Peterson
              > >
              > > Web Developer, Platform Engineering
              > >
              > > Yahoo!
              > >
              > > _____
              > >
              > > From: ydn-javascript@yahoogroups.com [mailto:ydn-
              > javascript@yahoogroups.com]
              > > On Behalf Of seasonedgeek
              > > Sent: Thursday, April 27, 2006 9:26 AM
              > > To: ydn-javascript@yahoogroups.com
              > > Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select
              > date opens
              > > a blank page
              > >
              > >
              > >
              > > A Yahoo Calendar widget is displayed on my page. When I click on
              a
              > > numbered day, the calendar displays the same behavior as the
              Yahoo
              > > default example and opens a new blank page with an address of
              > > javascript:void(null);
              > >
              > > Is this because of the class object? See snippet below. I don't
              > > define a <FORM></FORM> in my HTML.
              > >
              > > Any help or observation is most welcomed!
              > >
              > > --Tom.
              > >
              > > var DateWatcher = Class.create();
              > > DateWatcher.prototype = {
              > > initialize: function(dateField, calendarImage, calendarLayer) {
              > > this.dateField = $(dateField);
              > > this.calendarImage = $(calendarImage);
              > > this.calendarLayer = $(calendarLayer);
              > > this.calendar = null;
              > > //
              > > // Attach Event Listeners
              > > this.calendarImage.onclick =
              > > this.showCalendar.bindAsEventListener(this);
              > > },
              > >
              > > showCalendar: function() {
              > > if (this.calendarImage.src.indexOf('x') > -1)
              > > return false;
              > >
              > > //
              > > // Create calendar
              > > this.calendar =
              > > new YAHOO.widget.Calendar("cal1","cal1Container");
              > > this.calendar.onclick =
              > > this.getCalendarDate.bindAsEventListener(this);
              > > this.calendar.minDate =
              > > YAHOO.widget.DateMath.add(new Date(),
              > > YAHOO.widget.DateMath.DAY, 1);
              > > this.calendar.render();
              > > //
              > > // Use DIV to simulates popup calendar
              > > // DIV ID="cal1Container"
              > > this.calendarLayer.style.display = 'block';
              > > this.calendarImage.src = 'gifs/calx.gif';
              > > return false;
              > > }
              > > };
              > >
              > >
              > >
              > >
              > >
              > >
              > >
              > > _____
              > >
              > > YAHOO! GROUPS LINKS
              > >
              > >
              > >
              > > * Visit your group "ydn-javascript
              > > <http://groups.yahoo.com/group/ydn-javascript> " on the web.
              > >
              > > * To unsubscribe from this group, send an email to:
              > > ydn-javascript-unsubscribe@yahoogroups.com
              > > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
              > subject=Unsubscribe>
              > >
              > > * Your use of Yahoo! Groups is subject to the Yahoo!
              > > <http://docs.yahoo.com/info/terms/> Terms of Service.
              > >
              > >
              > >
              > > _____
              > >
              >
              >
              >
              >
              >
              >
              >
              > _____
              >
              > YAHOO! GROUPS LINKS
              >
              >
              >
              > * Visit your group "ydn-javascript
              > <http://groups.yahoo.com/group/ydn-javascript> " on the web.
              >
              > * To unsubscribe from this group, send an email to:
              > ydn-javascript-unsubscribe@yahoogroups.com
              > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
              subject=Unsubscribe>
              >
              > * Your use of Yahoo! Groups is subject to the Yahoo!
              > <http://docs.yahoo.com/info/terms/> Terms of Service.
              >
              >
              >
              > _____
              >
            • seasonedgeek
              Steven, An update: I got the calendar widget working on my page! I scrapped my modified version of the calendar.js and started over with a fresh copy of the
              Message 6 of 8 , Apr 28, 2006
              • 0 Attachment

                Steven,

                An update: I got the calendar widget working on my page! I scrapped my modified version of the calendar.js and started over with a fresh copy of the original calendar.js file. I wish I could paste a picture on this message to show you. The calendar widget works beautifully!

                I figured out how to get the calendar widget working using a class object: passing a reference to cal1 is the key when instaniating the object! I can now retrieved the selected calendar day and can now assign to a date entry field as M/D/Y. And I can move between months, forwards and backwards - no problem.

                Cheers,
                --Tom.

                 

                --- In ydn-javascript@yahoogroups.com, "seasonedgeek" <seasonedgeek@...> wrote:
                >
                > Steven,
                >
                > No, the issue does not occur on the default calendar example page
                > that's linked to the YDN site. I created a page on my server that
                > mirrors the behaviors of the YDN default calendar example page. When
                > I run the YDN default page on my server as is (the YDN files and
                > directories remain intact), the calendar widget works correctly.
                >
                > So, I got brave and I copied the calendar.js, dom.js, events.js and
                > YAHOO.js files to my js directory, the calendar.css file to my css
                > directory and the images to my images directories under my web app's
                > root directory, as recommeded.
                >
                > I created several versions of my test page following the example laid
                > out by the YDN default calendar page. All test versions define the
                > calendar container as shown in the YDN example. All my test versions
                > load a new page when clicking on a day cell or the previous/next
                > month image.
                >
                > I found a workaround where I substitute, in renderCellDefault(), a
                > <span name=cal1__2006_4_28>28</span> tag set instead of using the
                > default <a href="javascript:void(null);" name=cal1__2006_4_28>28</a>
                > tag set. I modified doSelectCell() and calendar.css to support this
                > change. Now, all versions can select a new day cell without loading a
                > new page.
                >
                > I attempted to apply the same solution to renderHeader() for the
                > previous and next iamges. The results were a mixed bag. For now, I've
                > reserved my changes in renderHeader().
                >
                > Version 1 is almost an exact replica of the YDN default calendar
                > example with one exception: the init() function is called after
                > testing to see if the document.readyState == complete. The calendar
                > widget works when selecting day cells; it fails when attempting to
                > move between months. The error message states that 'cal1' is
                > undefined when calling either cal1.previousMonth() or
                > cal1.nextMonth().
                >
                > Curious: the calendar.js documentation states that "cal1" is "the id
                > of the table element that will represent the calendar widget".
                > However, the actual code (snippet) displays:
                >
                > <div class=calordered id=cal1>
                > <table class=calendar cellspacing=0>
                >
                > Version 2 attempts to embed the yahoo calendar widget in the class
                > dateWatcher object. The Here, the calendar is displayed but the user
                > cannot move between months. Again the error message states
                > that 'cal1' is undefined as above.
                >
                > Any ideas, suggestions???
                >
                > Thanks,
                > --Tom.
                >
                > --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
                > peterson@ wrote:
                > >
                > > I haven't been able to re-create this issue. Does this occur on the
                > example
                > > that's linked from the YDN site? If so, it's possible that there
                > may be an
                > > issue with the way that your browser installation is handling
                > javascript
                > > links.
                > >
                > >
                > >
                > > Steven Peterson
                > >
                > > Web Developer, Platform Engineering
                > >
                > > Yahoo!
                > >
                > > _____
                > >
                > > From: ydn-javascript@yahoogroups.com [mailto:ydn-
                > javascript@yahoogroups.com]
                > > On Behalf Of seasonedgeek
                > > Sent: Thursday, April 27, 2006 2:20 PM
                > > To: ydn-javascript@yahoogroups.com
                > > Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript):
                > Select date
                > > opens a blank page
                > >
                > >
                > >
                > > Steve,
                > >
                > > I'm using IE 6 SP 1.
                > >
                > > --Tom.
                > >
                > > --- In ydn-javascript@yahoogroups.com, "Steven Peterson"
                > > <peterson@> wrote:
                > > >
                > > > Tom,
                > > >
                > > >
                > > >
                > > > Which browser are you using where the default calendar example is
                > > opening a
                > > > new window when you click a date?
                > > >
                > > >
                > > >
                > > > Thanks!
                > > >
                > > >
                > > >
                > > > Steven Peterson
                > > >
                > > > Web Developer, Platform Engineering
                > > >
                > > > Yahoo!
                > > >
                > > > _____
                > > >
                > > > From: ydn-javascript@yahoogroups.com [mailto:ydn-
                > > javascript@yahoogroups.com]
                > > > On Behalf Of seasonedgeek
                > > > Sent: Thursday, April 27, 2006 9:26 AM
                > > > To: ydn-javascript@yahoogroups.com
                > > > Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select
                > > date opens
                > > > a blank page
                > > >
                > > >
                > > >
                > > > A Yahoo Calendar widget is displayed on my page. When I click on
                > a
                > > > numbered day, the calendar displays the same behavior as the
                > Yahoo
                > > > default example and opens a new blank page with an address of
                > > > javascript:void(null);
                > > >
                > > > Is this because of the class object? See snippet below. I don't
                > > > define a <FORM></FORM> in my HTML.
                > > >
                > > > Any help or observation is most welcomed!
                > > >
                > > > --Tom.
                > > >
                > > > var DateWatcher = Class.create();
                > > > DateWatcher.prototype = {
                > > > initialize: function(dateField, calendarImage, calendarLayer) {
                > > > this.dateField = $(dateField);
                > > > this.calendarImage = $(calendarImage);
                > > > this.calendarLayer = $(calendarLayer);
                > > > this.calendar = null;
                > > > //
                > > > // Attach Event Listeners
                > > > this.calendarImage.onclick =
                > > > this.showCalendar.bindAsEventListener(this);
                > > > },
                > > >
                > > > showCalendar: function() {
                > > > if (this.calendarImage.src.indexOf('x') > -1)
                > > > return false;
                > > >
                > > > //
                > > > // Create calendar
                > > > this.calendar =
                > > > new YAHOO.widget.Calendar("cal1","cal1Container");
                > > > this.calendar.onclick =
                > > > this.getCalendarDate.bindAsEventListener(this);
                > > > this.calendar.minDate =
                > > > YAHOO.widget.DateMath.add(new Date(),
                > > > YAHOO.widget.DateMath.DAY, 1);
                > > > this.calendar.render();
                > > > //
                > > > // Use DIV to simulates popup calendar
                > > > // DIV ID="cal1Container"
                > > > this.calendarLayer.style.display = 'block';
                > > > this.calendarImage.src = 'gifs/calx.gif';
                > > > return false;
                > > > }
                > > > };
                > > >
                > > >
                > > >
                > > >
                > > >
                > > >
                > > >
                > > > _____
                > > >
                > > > YAHOO! GROUPS LINKS
                > > >
                > > >
                > > >
                > > > * Visit your group "ydn-javascript
                > > > <http://groups.yahoo.com/group/ydn-javascript> " on the web.
                > > >
                > > > * To unsubscribe from this group, send an email to:
                > > > ydn-javascript-unsubscribe@yahoogroups.com
                > > > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
                > > subject=Unsubscribe>
                > > >
                > > > * Your use of Yahoo! Groups is subject to the Yahoo!
                > > > <http://docs.yahoo.com/info/terms/> Terms of Service.
                > > >
                > > >
                > > >
                > > > _____
                > > >
                > >
                > >
                > >
                > >
                > >
                > >
                > >
                > > _____
                > >
                > > YAHOO! GROUPS LINKS
                > >
                > >
                > >
                > > * Visit your group "ydn-javascript
                > > <http://groups.yahoo.com/group/ydn-javascript> " on the web.
                > >
                > > * To unsubscribe from this group, send an email to:
                > > ydn-javascript-unsubscribe@yahoogroups.com
                > > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
                > subject=Unsubscribe>
                > >
                > > * Your use of Yahoo! Groups is subject to the Yahoo!
                > > <http://docs.yahoo.com/info/terms/> Terms of Service.
                > >
                > >
                > >
                > > _____
                > >
                >

              • Steven Peterson
                Tom, In regard to your check for document.readyState, the current init in the default Calendar example already waits until the document is loaded by using the
                Message 7 of 8 , May 2, 2006
                • 0 Attachment

                  Tom,

                   

                  In regard to your check for document.readyState, the current init in the default Calendar example already waits until the document is loaded by using the onLoad event. Document.readyState is actually only available in Internet Explorer, so wiring up the event handler will probably work more consistently for you.

                   

                  In terms of changing renderCellDefault, this should still not be necessary in order to make the example function correctly on your server. Can you provide a live link to your implementation that I can take a look at to see if I can track down why this might be occurring?

                   

                  In terms of the “cal1” undefined error, make certain that your local variable for the Calendar is also called “cal1”, since the next/previous JavaScript link is built using the variable name as part of the string. If you look at the default example, the variable name matches the ID passed in as the first argument in the constructor.

                   

                  Please let me know if that helps.

                   

                  Thanks!

                  Steven Peterson

                  Web Developer, Platform Engineering

                  Yahoo!


                  From: ydn-javascript@yahoogroups.com [mailto: ydn-javascript@yahoogroups.com ] On Behalf Of seasonedgeek
                  Sent: Friday, April 28, 2006 8:20 AM
                  To: ydn-javascript@yahoogroups.com
                  Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript): Select date opens a blank page

                   

                  Steven,

                  No, the issue does not occur on the default calendar example page
                  that's linked to the YDN site. I created a page on my server that
                  mirrors the behaviors of the YDN default calendar example page. When
                  I run the YDN default page on my server as is (the YDN files and
                  directories remain intact), the calendar widget works correctly.

                  So, I got brave and I copied the calendar.js, dom.js, events.js and
                  YAHOO.js files to my js directory, the calendar.css file to my css
                  directory and the images to my images directories under my web app's
                  root directory, as recommeded.

                  I created several versions of my test page following the example laid
                  out by the YDN default calendar page. All test versions define the
                  calendar container as shown in the YDN example. All my test versions
                  load a new page when clicking on a day cell or the previous/next
                  month image.

                  I found a workaround where I substitute, in renderCellDefault(), a
                  <span name=cal1__2006_4_28>28</span> tag set instead of using the
                  default <a href="javascript:void(null);" name=cal1__2006_4_28>28</a>
                  tag set. I modified doSelectCell() and calendar.css to support this
                  change. Now, all versions can select a new day cell without loading a
                  new page.

                  I attempted to apply the same solution to renderHeader() for the
                  previous and next iamges. The results were a mixed bag. For now, I've
                  reserved my changes in renderHeader().

                  Version 1 is almost an exact replica of the YDN default calendar
                  example with one exception: the init() function is called after
                  testing to see if the document.readyState == complete. The calendar
                  widget works when selecting day cells; it fails when attempting to
                  move between months. The error message states that 'cal1' is
                  undefined when calling either cal1.previousMonth() or
                  cal1.nextMonth().

                  Curious: the calendar.js documentation states that "cal1" is "the id
                  of the table element that will represent the calendar widget".
                  However, the actual code (snippet) displays:

                  <div class=calordered id=cal1>
                  <table class=calendar cellspacing=0>

                  Version 2 attempts to embed the yahoo calendar widget in the class
                  dateWatcher object. The Here, the calendar is displayed but the user
                  cannot move between months. Again the error message states
                  that 'cal1' is undefined as above.

                  Any ideas, suggestions???

                  Thanks,
                  --Tom.

                  --- In ydn-javascript@yahoogroups.com , "Steven Peterson"
                  <peterson@...> wrote:

                  >
                  > I haven't been able to re-create this issue. Does this occur on the
                  example
                  > that's linked from the YDN site? If so, it's possible that there
                  may be an
                  > issue with the way that your browser installation is handling
                  javascript
                  > links.
                  >

                  >
                  > Steven Peterson
                  >
                  > Web Developer, Platform Engineering
                  >
                  > Yahoo!
                  >
                  >   _____ 
                  >
                  > From: ydn-javascript@yahoogroups.com
                  [mailto:ydn-
                  javascript@yahoogroups.com]
                  > On Behalf Of seasonedgeek
                  > Sent: Thursday, April 27, 2006 2:20 PM
                  > To: ydn-javascript@yahoogroups.com
                  > Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript):
                  Select date
                  > opens a blank page
                  >

                  >
                  > Steve,
                  >
                  > I'm using IE 6 SP 1.
                  >
                  > --Tom.
                  >
                  > --- In ydn-javascript@yahoogroups.com ,
                  "Steven Peterson"
                  > <peterson@> wrote:
                  > >
                  > > Tom,
                  > >
                  > > 
                  > >
                  > > Which browser are you using where the default calendar example is
                  > opening a
                  > > new window when you click a date?
                  > >
                  > > 
                  > >
                  > > Thanks!
                  > >
                  > > 
                  > >
                  > > Steven Peterson
                  > >
                  > > Web Developer, Platform Engineering
                  > >
                  > > Yahoo!
                  > >
                  > >   _____ 
                  > >
                  > > From: ydn-javascript@yahoogroups.com
                  [mailto:ydn-
                  > javascript@yahoogroups.com]
                  > > On Behalf Of seasonedgeek
                  > > Sent: Thursday, April 27, 2006 9:26 AM
                  > > To: ydn-javascript@yahoogroups.com
                  > > Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select
                  > date opens
                  > > a blank page
                  > >
                  > > 
                  > >
                  > > A Yahoo Calendar widget is displayed on my page. When I click on
                  a
                  > > numbered day, the calendar displays the same behavior as the
                  Yahoo
                  > > default example and opens a new blank page with an address of
                  > > javascript:void(null);
                  > >
                  > > Is this because of the class object? See snippet below. I don't
                  > > define a <FORM></FORM> in my HTML.
                  > >
                  > > Any help or observation is most welcomed!
                  > >
                  > > --Tom.
                  > >
                  > > var DateWatcher = Class.create();
                  > > DateWatcher.prototype = {
                  > > initialize: function(dateField, calendarImage, calendarLayer) {
                  > >       this.dateField = $(dateField);
                  > >       this.calendarImage =
                  $(calendarImage);
                  > >       this.calendarLayer =
                  $(calendarLayer);
                  > >       this.calendar = null;
                  > >       //
                  > >       //     
                  Attach Event Listeners
                  > >       this.calendarImage.onclick =
                  > >             
                  this.showCalendar.bindAsEventListener(this);
                  > > },
                  > >
                  > > showCalendar: function() {
                  > >       if
                  (this.calendarImage.src.indexOf('x') > -1)
                  > >       return false;
                  > >
                  > >       //
                  > >       // Create calendar
                  > >       this.calendar =
                  > >            
                  new YAHOO.widget.Calendar("cal1","cal1Container");
                  > >       this.calendar.onclick =
                  > >            
                  this.getCalendarDate.bindAsEventListener(this);
                  > >       this.calendar.minDate =
                  > >            
                  YAHOO.widget.DateMath.add(new Date(),
                  > >                
                  YAHOO.widget.DateMath.DAY, 1);
                  > >       this.calendar.render();
                  > >       //
                  > >       // Use DIV to simulates popup
                  calendar
                  > >         // DIV
                  ID="cal1Container"
                  > >       this.calendarLayer.style.display
                  = 'block';
                  > >       this.calendarImage.src =
                  'gifs/calx.gif';
                  > >       return false;
                  > >     }
                  > > };
                  > >
                  > >
                  > >
                  > >
                  > >
                  > >
                  > >
                  > >   _____ 
                  > >
                  > > YAHOO! GROUPS LINKS
                  > >
                  > > 
                  > >
                  > > *      Visit your group "ydn-javascript
                  > > <http://groups.yahoo.com/group/ydn-javascript>
                  " on the web.
                  > >  
                  > > *      To unsubscribe from this group, send
                  an email to:
                  > >  ydn-javascript-unsubscribe@yahoogroups.com
                  > > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
                  > subject=Unsubscribe>
                  > >  
                  > > *      Your use of Yahoo! Groups is subject
                  to the Yahoo!
                  > > <http://docs.yahoo.com/info/terms/
                  Terms of Service.
                  > >
                  > > 
                  > >
                  > >   _____
                  > >
                  >
                  >
                  >
                  >
                  >
                  >
                  >
                  >   _____ 
                  >
                  > YAHOO! GROUPS LINKS
                  >

                  >
                  > *      Visit your group "ydn-javascript
                  > <http://groups.yahoo.com/group/ydn-javascript>
                  " on the web.
                  >  
                  > *      To unsubscribe from this group, send an
                  email to:
                  >  ydn-javascript-unsubscribe@yahoogroups.com
                  > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
                  subject=Unsubscribe>
                  >  
                  > *      Your use of Yahoo! Groups is subject to
                  the Yahoo!
                  > <http://docs.yahoo.com/info/terms/
                  Terms of Service.
                  >

                  >
                  >   _____
                  >





                • Steven Peterson
                  Tom, Just caught this after replying to your previous message. I m glad you got it working! :-) Steven Peterson Web Developer, Platform Engineering Yahoo!
                  Message 8 of 8 , May 2, 2006
                  • 0 Attachment

                    Tom,

                     

                    Just caught this after replying to your previous message. I’m glad you got it working! J

                     

                    Steven Peterson

                    Web Developer, Platform Engineering

                    Yahoo!


                    From: ydn-javascript@yahoogroups.com [mailto: ydn-javascript@yahoogroups.com ] On Behalf Of seasonedgeek
                    Sent: Friday, April 28, 2006 3:52 PM
                    To: ydn-javascript@yahoogroups.com
                    Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript): Select date opens a blank page

                     

                    Steven,

                    An update: I got the calendar widget working on my page! I scrapped my modified version of the calendar.js and started over with a fresh copy of the original calendar.js file. I wish I could paste a picture on this message to show you. The calendar widget works beautifully!

                    I figured out how to get the calendar widget working using a class object: passing a reference to cal1 is the key when instaniating the object! I can now retrieved the selected calendar day and can now assign to a date entry field as M/D/Y. And I can move between months, forwards and backwards - no problem.

                    Cheers,
                    --Tom.

                     

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

                    >
                    > Steven,
                    >
                    > No, the issue does not occur on the default calendar example page
                    > that's linked to the YDN site. I created a page on my server that
                    > mirrors the behaviors of the YDN default calendar example page. When
                    > I run the YDN default page on my server as is (the YDN files and
                    > directories remain intact), the calendar widget works correctly.
                    >
                    > So, I got brave and I copied the calendar.js, dom.js, events.js and
                    > YAHOO.js files to my js directory, the calendar.css file to my css
                    > directory and the images to my images directories under my web app's
                    > root directory, as recommeded.
                    >
                    > I created several versions of my test page following the example laid
                    > out by the ! YDN default calendar page. All test versions define the
                    > calendar container as shown in the YDN example. All my test versions
                    > load a new page when clicking on a day cell or the previous/next
                    > month image.
                    >
                    > I found a workaround where I substitute, in renderCellDefault(), a
                    > <span name=cal1__2006_4_28>28</span> tag set instead of using
                    the
                    > default <a href="javascript:void(null);"
                    name=cal1__2006_4_28>28</a>
                    > tag set. I modified doSelectCell() and calendar.css to support this
                    > change. Now, all versions can select a new day cell without loading a
                    > new page.
                    >
                    > I attempted to apply the same solution to renderHeader() for the
                    > previous and next iamges. The results were a mixed bag. For now, I've
                    > reserved my changes in renderHeader().
                    >
                    > Version 1 is almost an exact replica of the YDN default calendar
                    > example with one excep! tion: the init() function is called after
                    > testing to see if t he document.readyState == complete. The calendar
                    > widget works when selecting day cells; it fails when attempting to
                    > move between months. The error message states that 'cal1' is
                    > undefined when calling either cal1.previousMonth() or
                    > cal1.nextMonth().
                    >
                    > Curious: the calendar.js documentation states that "cal1" is
                    "the id
                    > of the table element that will represent the calendar widget".
                    > However, the actual code (snippet) displays:
                    >
                    > <div class=calordered id=cal1>
                    > <table class=calendar cellspacing=0>
                    >
                    > Version 2 attempts to embed the yahoo calendar widget in the class
                    > dateWatcher object. The Here, the calendar is displayed but the user
                    > cannot move between months. Again the error message states
                    > that 'cal1' is undefined as above.
                    >
                    > Any ideas, suggestions???
                    >
                    > Thanks,
                    > --Tom.
                    >
                    > --- In ydn-! javascript@yahoogroups.com, "Steven Peterson"
                    > peterson@ wrote:
                    > >
                    > > I haven't been able to re-create this issue. Does this occur on the
                    > example
                    > > that's linked from the YDN site? If so, it's possible that there
                    > may be an
                    > > issue with the way that your browser installation is handling
                    > javascript
                    > > links.
                    > >
                    > >
                    > >
                    > > Steven Peterson
                    > >
                    > > Web Developer, Platform Engineering
                    > >
                    > > Yahoo!
                    > >
                    > > _____
                    > >
                    > > From: ydn-javascript@yahoogroups.com
                    [mailto:ydn-
                    > javascript@yahoogroups.com]
                    > > On Behalf Of seasonedgeek
                    > > Sent: Thursday, April 27, 2006 2:20 PM
                    > > To: ydn-javascript@yahoogroups.com
                    > > Subject: [ydn-javascript] Re: Yahoo Calendar UI (JavaScript):
                    > Select date
                    > > opens a blank page
                    > >! ;
                    > >
                    > >
                    > > Steve,
                    > >
                    &g t; > I'm using IE 6 SP 1.
                    > >
                    > > --Tom.
                    > >
                    > > --- In ydn-javascript@yahoogroups.com ,
                    "Steven Peterson"
                    > > <peterson@> wrote:
                    > > >
                    > > > Tom,
                    > > >
                    > > >
                    > > >
                    > > > Which browser are you using where the default calendar example
                    is
                    > > opening a
                    > > > new window when you click a date?
                    > > >
                    > > >
                    > > >
                    > > > Thanks!
                    > > >
                    > > >
                    > > >
                    > > > Steven Peterson
                    > > >
                    > > > Web Developer, Platform Engineering
                    > > >
                    > > > Yahoo!
                    > > >
                    > > > _____
                    > > >
                    > > > From: ydn-javascript@yahoogroups.com
                    [mailto:ydn-
                    > > javascript@yahoogroups.com]
                    > > > On Behalf Of seasonedgeek
                    > > > Sent: Thursday, Apri! l 27, 2006 9:26 AM
                    > > > To: ydn-javascript@yahoogroups.com
                    > > > Subject: [ydn-javascript] Yahoo Calendar UI (JavaScript): Select
                    > > date opens
                    > > > a blank page
                    > > >
                    > > >
                    > > >
                    > > > A Yahoo Calendar widget is displayed on my page. When I click on
                    > a
                    > > > numbered day, the calendar displays the same behavior as the
                    > Yahoo
                    > > > default example and opens a new blank page with an address of
                    > > > javascript:void(null);
                    > > >
                    > > > Is this because of the class object? See snippet below. I don't
                    > > > define a <FORM></FORM> in my HTML.
                    > > >
                    > > > Any help or observation is most welcomed!
                    > > >
                    > > > --Tom.
                    > > >
                    > > > var DateWatcher = Class.create();
                    > > > DateWatcher.prototype = {
                    ! > > > initialize: function(dateField, calendarImage, calendar Layer) {
                    > > > this.dateField = $(dateField);
                    > > > this.calendarImage = $(calendarImage);
                    > > > this.calendarLayer = $(calendarLayer);
                    > > > this.calendar = null;
                    > > > //
                    > > > // Attach Event Listeners
                    > > > this.calendarImage.onclick =
                    > > > this.showCalendar.bindAsEventListener(this);
                    > > > },
                    > > >
                    > > > showCalendar: function() {
                    > > > if (this.calendarImage.src.indexOf('x') > -1)
                    > > > return false;
                    > > >
                    > > > //
                    > > > // Create calendar
                    > > > this.calendar =
                    > > > new
                    YAHOO.widget.Calendar("cal1","cal1Container");
                    > > > this.calendar.onclick =
                    > > > this.getCalendarDate.bindAsEventListener(this);
                    > > > this.calendar.minDate =
                    > > > YAHOO.widget.DateMath.add(new Date(),
                    > > > YAHOO.widg! et.DateMath.DAY, 1);
                    > > > this.calendar.render();
                    > > > //
                    > > > // Use DIV to simulates popup calendar
                    > > > // DIV ID="cal1Container"
                    > > > this.calendarLayer.style.display = 'block';
                    > > > this.calendarImage.src = 'gifs/calx.gif';
                    > > > return false;
                    > > > }
                    > > > };
                    > > >
                    > > >
                    > > >
                    > > >
                    > > >
                    > > >
                    > > >
                    > > > _____
                    > > >
                    > > > YAHOO! GROUPS LINKS
                    > > >
                    > > >
                    > > >
                    > > > * Visit your group "ydn-javascript
                    > > > <http://groups.yahoo.com/group/ydn-javascript> " on
                    the web.
                    > > >
                    > > > * To unsubscribe from this group, send an email to:
                    > > > ydn-javascript-unsubscribe@yahoogroups.com
                    > > > <mailto:ydn-javascript-uns! ubscribe@yahoogroups.com?
                    > > subject=Unsubscribe>
                    > ; > >
                    > > > * Your use of Yahoo! Groups is subject to the Yahoo!
                    > > > <http://docs.yahoo.com/info/terms/> Terms of Service.
                    > > >
                    > > >
                    > > >
                    > > > _____
                    > > >
                    > >
                    > >
                    > >
                    > >
                    > >
                    > >
                    > >
                    > > _____
                    > >
                    > > YAHOO! GROUPS LINKS
                    > >
                    > >
                    > >
                    > > * Visit your group "ydn-javascript
                    > > <http://groups.yahoo.com/group/ydn-javascript> " on the
                    web.
                    > >
                    > > * To unsubscribe from this group, send an email to:
                    > > ydn-javascript-unsubscribe@yahoogroups.com
                    > > <mailto:ydn-javascript-unsubscribe@yahoogroups.com?
                    > subject=Unsubscribe>
                    > >
                    > > * Your use of Yahoo! Groups is subject to the Yahoo!
                    > > <http://docs.yahoo.com/info/terms/> Terms of Service. > >
                    > >
                    > >
                    > > _____
                    > >
                    >

                     

                  Your message has been successfully submitted and would be delivered to recipients shortly.