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

Re: calendar to edit text field

Expand Messages
  • Adrian Nye
    Ok this one is complete. Added click listener on the whole document and then hide the calendar if the click is anywhere except in the calendar or date input
    Message 1 of 4 , Apr 1, 2009
    • 0 Attachment
      Ok this one is complete. Added click listener on the whole document and then hide the calendar if the click is anywhere except in the calendar or date input field.

      var updateCal = function (calendar) {
      //alert('update cal');
      //sets calendar date from text in input field
      var txtDate1 = document.getElementById("id_date");
      //var cal1 = document.getElementById("cal1");
      if (txtDate1.value !== "") {
      calendar.select(txtDate1.value);
      var selectedDates = calendar.getSelectedDates();
      if (selectedDates.length > 0) {
      var firstDate = selectedDates[0];
      calendar.cfg.setProperty("pagedate", (firstDate.getMonth()+1) + "/" + firstDate.getFullYear());
      calendar.render();
      } else {
      alert("Error: Calendar date not returned");
      }

      }
      };

      var displayCal = function (e, calendar) {

      updateCal(calendar);
      var X = Dom.getX('id_date');
      var Y = Dom.getY('id_date');

      Dom.setX('calendarContainer', X);
      Dom.setY('calendarContainer', Y + 30);
      calendar.show();
      };
      var hideCal = function (e, calendar) {
      var target = YAHOO.util.Event.getTarget(e);

      var txtDate = document.getElementById("id_date");

      //this.id == "cal1" no matter where click occurred

      //if not in id_date or calendar, hide

      if ((target != txtDate) && (target != calendar)) {
      calendar.hide();
      }
      };

      var calSelect = function (type,args,obj) {

      //sets input field with calendar-selected date
      var dates = args[0];
      var date = dates[0];
      var year = date[0], month = date[1], day = date[2];

      var txtDate1 = document.getElementById("id_date");
      txtDate1.value = month + "/" + day + "/" + year;

      obj.hide();
      };

      YAHOO.my.calendar = new YAHOO.widget.Calendar("cal1","calendarContainer");
      YAHOO.my.calendar.selectEvent.subscribe(calSelect, YAHOO.my.calendar, true);

      YAHOO.util.Event.addListener(document, "click", hideCal, YAHOO.my.calendar, true);
      YAHOO.util.Event.addListener("id_date", "click", displayCal, YAHOO.my.calendar, true);
    Your message has been successfully submitted and would be delivered to recipients shortly.