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

Re: How to limit how many dates are selected from calendar

Expand Messages
  • belingueres
    Hi Steven, Since I didn t find any setting into the docs, I decided to modify the source code a bit to allow this and I make it work well. I think the solution
    Message 1 of 3 , Apr 12, 2006
    • 0 Attachment

      Hi Steven,

      Since I didn't find any setting into the docs, I decided to modify the source code a bit to allow this and I make it work well. I think the solution is equivalent.

      Basically, I subclassed the Calendar and modified the onBeforeSelect method to return a boolean value. If it returns true, the select/selectCell methods proceed with the selection. If false, it does not select anything.

      Here is the code:

      YAHOO.widget.Calendar_ES.prototype.select = function(date) {
        if ( this.onBeforeSelect() ) {

          var aToBeSelected = this._toFieldArray(date);

          for (var a=0;a<aToBeSelected.length;++a)
          {
            var toSelect = aToBeSelected[a]; // For each date item in the list of dates we're trying to select
            if (this._indexOfSelectedFieldArray(toSelect) == -1) // not already selected?
            {
              this.selectedDates[this.selectedDates.length]=toSelect;
            }
          }

          if (this.parent) {
            this.parent.sync(this);
          }

          this.onSelect();
        }
        return this.getSelectedDates();
      };

      YAHOO.widget.Calendar_ES.prototype.selectCell = function(cellIndex) {
        if ( this.onBeforeSelect() ) {

          this.cells = this.tbody.getElementsByTagName("TD");

          var cell = this.cells[cellIndex];
          var cellDate = this.cellDates[cellIndex];

          var dCellDate = this._toDate(cellDate);

          var selectDate = cellDate.concat();

          this.selectedDates.push(selectDate);

          if (this.parent) {
            this.parent.sync(this);
          }

          this.renderCellStyleSelected(dCellDate,cell);

          this.onSelect();
          this.doCellMouseOut.call(cell, null, this);
        }
        return this.getSelectedDates();
      };

      Then the actual client code is:

        cal1.onBeforeSelect = seleccionado;

        cal1.onDeselect = deseleccionado;

       

      var cantidad = 0;

      function seleccionado() {
        if ( cantidad == 5 ) {
          alert('No pueden seleccionarse más de 5 fechas');
          return false;
        }
        ++cantidad;
        return true;
      }

      function deseleccionado() {
        --cantidad;
      }

      My other question (how to not allow selection of weekend days) is somewhat more difficult to resolve since I think I must modify the renderBody() code. /:)

      Regards,

      Gabriel


      --- In ydn-javascript@yahoogroups.com, "Steven Peterson" <peterson@...> wrote:
      >
      > Gabriel,
      >
      >
      >
      > You basically want to trap a user's selection beforehand and not permit it
      > if it would cause you to go over the 5-day limit. Here's a code snippet that
      > will allow you to do just that. The code that's been added to the base code
      > is in bold and italicized.
      >
      >
      >
      > calendar.selectCell = function(cellIndex) {
      >
      > if (this.selectedDates.length+1 > 5) {
      >
      > alert("Only 5 selections are permitted.");
      >
      > return this.getSelectedDates();
      >
      > }
      >
      >
      >
      > this.onBeforeSelect();
      >
      >
      >
      > this.cells = this.tbody.getElementsByTagName("TD");
      >
      >
      >
      > var cell = this.cells[cellIndex];
      >
      > var cellDate = this.cellDates[cellIndex];
      >
      >
      >
      > var dCellDate = this._toDate(cellDate);
      >
      >
      >
      > var selectDate = cellDate.concat();
      >
      >
      >
      > this.selectedDates.push(selectDate);
      >
      >
      >
      > if (this.parent) {
      >
      > this.parent.sync(this);
      >
      > }
      >
      >
      >
      > this.renderCellStyleSelected(dCellDate,cell);
      >
      >
      >
      > this.onSelect();
      >
      > this.doCellMouseOut.call(cell, null, this);
      >
      >
      >
      > return this.getSelectedDates();
      >
      > };
      >
      >
      >
      > This code will cause the Calendar to abort a selection if it appears to go
      > over the allowed maximum. I will take note of this issue as a potential
      > future release feature. If you have any more questions, please don't
      > hesitate to ask!
      >
      >
      > Thanks!!
      >
      >
      >
      > Steven Peterson
      >
      > Web Developer, Platform Engineering
      >
      > Yahoo!
      >
      > _____
      >
      > From: ydn-javascript@yahoogroups.com [mailto:ydn-javascript@yahoogroups.com]
      > On Behalf Of belingueres
      > Sent: Wednesday, April 12, 2006 9:31 AM
      > To: ydn-javascript@yahoogroups.com
      > Subject: [ydn-javascript] How to limit how many dates are selected from
      > calendar
      >
      >
      >
      > Hi,
      >
      > I need a calendar where the user could select 5 days top from it. I
      > setted the
      >
      > calendar.Options.MULTI_SELECT = true;
      >
      > flag but don't know how to do for controlling that only fire dates can
      > be selected at once.
      >
      > TIA,
      > Gabriel
      >
      >
      >
      >
      >
      >
      >
      > _____
      >
      > 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.