View Issue Details

IDProjectCategoryView StatusLast Update
0005774mantisbtfeaturepublic2012-11-09 18:20
Reporterruss Assigned Todregad  
PrioritynormalSeverityfeatureReproducibilityN/A
Status closedResolutionduplicate 
Summary0005774: Add support for using jscalendar (calendar widget) to select dates
Description

Add support for using jscalendar to select dates. Our clients find it easier and faster to use. I've modified the current CVS HEAD to allow selection of dates with the jscalendar widget. The jscalendar widget can be obtained from http://sourceforge.net/projects/jscalendar . It is licensed under the LGPL. In my installation I made the use of the calendar widget optional through a global variable.

<b>Changes</b>:

Currently there are two sections of code that print date selection widgets: the filter code for searching by date and printing of custom fields that are dates.

I updated the following files:

patched file(s):
core/date_api.php
core/filter_api.php
meta_inc.php
config_defaults_inc.php
lang/strings_english.txt

<b>Not included in patch</b>

config_defaults_inc.php:
// Allows use of jscalendar for date selection.
// jscalendar must be installed in $docroot/jscalendar
$g_date_use_calendar = ON

lang/strings_english.txt:
// Calendar title
$s_calendar_title = "Calendar";

The jscalendar code was unpacked in the docroot and a symlink, jscalendar, was made to the jscalendar-1.0 directory. Version 1.0 of the calendar widget was used.

<b>Limitations</b>:

  • The calendar widget is internationalized and there are localization files for many languages in the distribution, but I did not integrate support for multiple languages. This should be trivial to do.
  • I could not find a straight forward way to disable the calendar selection button in the time I had to implement this; therefore, it is possible to select a date via the calendar when the date widget is disabled. This shouldn't be too difficult to fix.

<b>Outstanding Items</b>:

  • I couldn't find a satisfactory way to include the necessary javascript files. They are included in meta_inc.php. It would be nice if there was a way to register javascript libraries based on the installation options and client. I saw no way to do this, so I added the necessary code to the meta_inc.php file. If there is a better way to do this, please let me know.

  • I first made the calendar selection available through the use of an image element inside a button element (<button ...> <img ...><\button&gt). The button took up too much space so I changed it so the image element was inside a span element. I prefer the button from a usability perspective. It might be best to make this an option, but that may depend on the resolution of the disable/enable problem.

TagsNo tags attached.
Attached Files
snapshot5.png (25,008 bytes)   
snapshot5.png (25,008 bytes)   
patch.txt (12,101 bytes)   
Index: meta_inc.php
===================================================================
RCS file: /cvsroot/mantisbt/mantisbt/meta_inc.php,v
retrieving revision 1.18
diff -u -r1.18 meta_inc.php
--- meta_inc.php	19 May 2005 00:25:52 -0000	1.18
+++ meta_inc.php	12 Jun 2005 06:41:30 -0000
@@ -9,6 +9,7 @@
 	# $Id: meta_inc.php,v 1.18 2005/05/19 00:25:52 thraxisp Exp $
 	# --------------------------------------------------------
 
+    require_once( 'core.php' );
     global $g_allow_browser_cache;
     if ( ! isset( $g_allow_browser_cache ) ) {
 ?>
@@ -18,3 +19,116 @@
 	<meta http-equiv="Cache-Directive" content="no-cache" />
 <?php } # ! isset( $g_allow_browser_cache )  ?>
 	<meta http-equiv="Expires" content="<?php echo gmdate( 'D, d M Y H:i:s \G\M\T', time() ) ?>" />
+
+<?php
+    
+    # Include jscalendar if configured
+    if ( config_get('date_use_calendar') == ON) {
+
+     ?>
+      <style type="text/css">@import url(jscalendar/calendar-win2k-1.css);</style>
+      <script type="text/javascript" src="jscalendar/calendar.js"></script>
+      <script type="text/javascript" src="jscalendar/lang/calendar-en.js"></script>
+      <script type="text/javascript" src="jscalendar/calendar-setup.js"></script>
+      <script type="text/javascript">
+
+      _dynarch_popupCalendar = null;
+
+      // Calendar onSelect handler. This object contains the element IDs
+      // that are used to set the date.
+      CalendarSelectHandler = function (yearId, monthId, dayId) {
+        this.yearId = yearId;
+        this.monthId = monthId;
+        this.dayId = dayId;
+        // onSelect handler for the Calendar object.
+        this.onSelect = function (calendar, date) {
+            if(calendar.dateClicked) {
+            var year = document.getElementById(yearId);
+            if(year)
+                year.value = calendar.date.getFullYear();
+            var month = document.getElementById(monthId);
+            if(month)
+              month.value = calendar.date.getMonth() + 1;
+            var day = document.getElementById(dayId);
+            if(day)
+              day.value = calendar.date.getDate();
+            closeHandler(calendar);
+          }
+        }
+      }
+      
+      // This function closes the calendar
+      function closeHandler(cal) {
+        cal.hide();
+        _dynarch_popupCalendar = null;
+      }
+
+      // This function shows the calendar under the element having the given id.
+      // It takes care of catching "mousedown" signals on document and hiding the
+      // calendar if the click was outside.
+      function showCalendar(triggerId, selectHandler) {
+
+        if(!document.getElementById)
+          return; // do nothing if function is not supported.
+
+        var trigger = document.getElementById(triggerId);
+        var year = document.getElementById(selectHandler.yearId);
+        var month = document.getElementById(selectHandler.monthId);
+        var day = document.getElementById(selectHandler.dayId);
+        var aday = new Date();
+        
+        //if(!trigger)
+        //  alert("Missing trigger");
+        //if(!year)
+        //  alert("Missing year");
+        //if(!month)
+        //  alert("Missing month");
+        //if(!day)
+        //  alert("Missing day");
+
+        if (_dynarch_popupCalendar != null) {
+          // we already have some calendar created
+          _dynarch_popupCalendar.hide();                 // so we hide it first.
+        } else {
+          // first-time call, create the calendar.
+          var cal = new Calendar(1, null, selectHandler.onSelect, closeHandler);
+          // uncomment the following line to hide the week numbers
+          // cal.weekNumbers = false;
+          cal.showsOtherMonths = true;
+          _dynarch_popupCalendar = cal;                  // remember it in the global var
+          
+          var min = aday.getFullYear();
+          var max = min;
+          for(x = 0; x < year.options.length; x++) {
+            var val = year.options[x].value;
+            if(val == 0)
+              continue;
+            if(val > max)
+              max = val;
+            if(val < min)
+              min = val;
+          }
+
+          cal.setRange(min, max);        // min/max year allowed.
+          cal.create();
+        }
+
+        if(year.value && year.value > 0)
+          aday.setFullYear(year.value);
+        if(month.value && month.value > 0)
+          aday.setMonth(month.value - 1);
+        if(day.value && day.value > 0)
+          aday.setDate(day.value);
+
+        _dynarch_popupCalendar.setDate(aday);
+
+        _dynarch_popupCalendar.showAtElement(trigger);
+
+        return false;
+      }
+
+      </script>
+
+     <?php
+    }
+?>
Index: core/date_api.php
===================================================================
RCS file: /cvsroot/mantisbt/mantisbt/core/date_api.php,v
retrieving revision 1.7
diff -u -r1.7 date_api.php
--- core/date_api.php	26 Feb 2005 01:00:39 -0000	1.7
+++ core/date_api.php	12 Jun 2005 06:41:30 -0000
@@ -92,6 +92,7 @@
 	# --------------------
 
 	function print_date_selection_set( $p_name, $p_format, $p_date=0, $p_default_disable=false, $p_allow_blank=false, $p_year_start=0, $p_year_end=0) {
+
 		$t_chars = preg_split('//', $p_format, -1, PREG_SPLIT_NO_EMPTY) ;
 		if ( $p_date != 0 ) {
 			$t_date = preg_split('/-/', date( 'Y-m-d', $p_date), -1, PREG_SPLIT_NO_EMPTY) ;
@@ -107,33 +108,53 @@
 		if ( $p_allow_blank == true ) {
 			$t_blank_line = "<option value=\"0\"></option>" ;
 		}
-
+    $t_month_id = $p_name . "_month";
+    $t_day_id = $p_name . "_day";
+    $t_year_id = $p_name . "_year";
 		foreach( $t_chars as $t_char ) {
 			if (strcmp( $t_char, "M") == 0) {
-				echo "<select name=\"" . $p_name . "_month\" $t_disable>" ;
+				echo "<select id=\"" . $t_month_id  . "\" name=\"" . $t_month_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_month_option_list( $t_date[1] ) ;
 				echo "</select>\n" ;
 			}
 			if (strcmp( $t_char, "m") == 0) {
-				echo "<select name=\"" . $p_name . "_month\" $t_disable>" ;
+				echo "<select  id=\"" . $t_month_id  . "\" name=\"" . $t_month_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_numeric_month_option_list( $t_date[1] ) ;
 				echo "</select>\n" ;
 			}
 			if (strcasecmp( $t_char, "D") == 0) {
-				echo "<select name=\"" . $p_name . "_day\" $t_disable>" ;
+				echo "<select id=\"" . $t_day_id . "\" name=\"" . $t_day_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_day_option_list( $t_date[2] ) ;
 				echo "</select>\n" ;
 			}
 			if (strcasecmp( $t_char, "Y") == 0) {
-				echo "<select name=\"" . $p_name . "_year\" $t_disable>" ;
+				echo "<select id=\"" . $t_year_id . "\" name=\"" . $t_year_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_year_range_option_list( $t_date[0], $p_year_start, $p_year_end ) ;
 				echo "</select>\n" ;
 			}
 		}
+
+    # Include jscalendar if configured
+    if ( config_get('date_use_calendar') == ON) {
+      $t_calendar_title = lang_get('calendar_title');
+      $t_cal_name = $p_name . "_calendar";
+      $t_cal_object_name = $t_cal_name . "_object";
+      
+      # Can't disable/enable buttons
+      #echo "<button id=\"$t_cal_name\" type=\"button\" name=\"$t_cal_name\" value=\"...\" ";
+      #echo " title=\"$t_calendar_title\" ";
+      #echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('$t_year_id', '$t_month_id', '$t_day_id'))\" $t_disable>";
+      #echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\"> </button> \n";
+      
+      # 
+      echo "<span id=\"$t_cal_name\" title=\"$t_calendar_title\" ";
+      echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('$t_year_id', '$t_month_id', '$t_day_id'))\" >";
+      echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\" > </span> \n";
+    }
 	}
 
 ?>
Index: core/filter_api.php
===================================================================
RCS file: /cvsroot/mantisbt/mantisbt/core/filter_api.php,v
retrieving revision 1.116
diff -u -r1.116 filter_api.php
--- core/filter_api.php	7 Jun 2005 19:49:53 -0000	1.116
+++ core/filter_api.php	12 Jun 2005 06:41:30 -0000
@@ -2716,21 +2716,39 @@
 			$t_chars = preg_split( '//', config_get( 'short_date_format' ), -1, PREG_SPLIT_NO_EMPTY );
 			foreach( $t_chars as $t_char ) {
 				if ( strcasecmp( $t_char, "M" ) == 0 ) {
-					print "<select name=\"start_month\" $t_menu_disabled>";
+					print "<select id=\"start_month\" name=\"start_month\" $t_menu_disabled>";
 					print_month_option_list( $t_filter['start_month'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "D" ) == 0 ) {
-					print "<select name=\"start_day\" $t_menu_disabled>";
+					print "<select id=\"start_day\" name=\"start_day\" $t_menu_disabled>";
 					print_day_option_list( $t_filter['start_day'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "Y" ) == 0 ) {
-					print "<select name=\"start_year\" $t_menu_disabled>";
+					print "<select id=\"start_year\" name=\"start_year\" $t_menu_disabled>";
 					print_year_option_list( $t_filter['start_year'] );
 					print "</select>\n";
 				}
 			}
+
+      # Include jscalendar if configured
+      if ( config_get('date_use_calendar') == ON) {
+        $t_calendar_title = lang_get('calendar_title');
+        $t_cal_name = "start_date_calendar";
+        $t_cal_object_name = $t_cal_name . "_object";
+        
+        # Can't disable/enable buttons
+        #echo "<button id=\"$t_cal_name\" type=\"button\" name=\"$t_cal_name\" value=\"...\" ";
+        #echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('start_year', 'start_month', 'start_day'))\" $t_menu_disable>";
+        #echo "<img src=\"/jscalendar/img.gif\" alt=\"calendar\"> </button> \n";
+        
+        # 
+        echo "<span id=\"$t_cal_name\" title=\"$t_calendar_title\" ";
+        echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('start_year', 'start_month', 'start_day'))\" >";
+        echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\" > </span> \n";
+      }
+
 			?>
 			</td>
 		</tr>
@@ -2744,21 +2762,39 @@
 			$t_chars = preg_split( '//', config_get( 'short_date_format' ), -1, PREG_SPLIT_NO_EMPTY );
 			foreach( $t_chars as $t_char ) {
 				if ( strcasecmp( $t_char, "M" ) == 0 ) {
-					print "<select name=\"end_month\" $t_menu_disabled>";
+					print "<select id=\"end_month\" name=\"end_month\" $t_menu_disabled>";
 					print_month_option_list( $t_filter['end_month'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "D" ) == 0 ) {
-					print "<select name=\"end_day\" $t_menu_disabled>";
+					print "<select id=\"end_day\" name=\"end_day\" $t_menu_disabled>";
 					print_day_option_list( $t_filter['end_day'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "Y" ) == 0 ) {
-					print "<select name=\"end_year\" $t_menu_disabled>";
+					print "<select id=\"end_year\" name=\"end_year\" $t_menu_disabled>";
 					print_year_option_list( $t_filter['end_year'] );
 					print "</select>\n";
 				}
 			}
+
+      # Include jscalendar if configured
+      if ( config_get('date_use_calendar') == ON) {
+        $t_calendar_title = lang_get('calendar_title');
+        $t_cal_name = "end_date_calendar";
+        $t_cal_object_name = $t_cal_name . "_object";
+        
+        # Can't disable/enable buttons
+        #echo "<button id=\"$t_cal_name\" type=\"button\" name=\"$t_cal_name\" value=\"...\" ";
+        #echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('end_year', 'end_month', 'end_day'))\" $t_menu_disable>";
+        #echo "<img src=\"/jscalendar/img.gif\" alt=\"calendar\"> </button> \n";
+        
+        # 
+        echo "<span id=\"$t_cal_name\" title=\"$t_calendar_title\" ";
+        echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('end_year', 'end_month', 'end_day'))\" >";
+        echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\" > </span> \n";
+      }
+
 			?>
 			</td>
 		</tr>
patch.txt (12,101 bytes)   
patch-update1.txt (11,740 bytes)   
Index: meta_inc.php
===================================================================
RCS file: /cvsroot/mantisbt/mantisbt/meta_inc.php,v
retrieving revision 1.18
diff -u -r1.18 meta_inc.php
--- meta_inc.php        19 May 2005 00:25:52 -0000      1.18
+++ meta_inc.php        12 Jun 2005 23:55:51 -0000
@@ -9,6 +9,7 @@
        # $Id: meta_inc.php,v 1.18 2005/05/19 00:25:52 thraxisp Exp $
        # --------------------------------------------------------

+    require_once( 'core.php' );
     global $g_allow_browser_cache;
     if ( ! isset( $g_allow_browser_cache ) ) {
 ?>
@@ -18,3 +19,114 @@
        <meta http-equiv="Cache-Directive" content="no-cache" />
 <?php } # ! isset( $g_allow_browser_cache )  ?>
        <meta http-equiv="Expires" content="<?php echo gmdate( 'D, d M Y H:i:s \G\M\T', time() ) ?>" />
+
+<?php
+
+  # Include jscalendar if configured
+  if ( config_get('date_use_calendar') == ON) {
+
+    ?>
+    <style type="text/css">@import url(jscalendar/calendar-win2k-1.css);</style>
+    <script type="text/javascript" src="jscalendar/calendar.js"></script>
+    <script type="text/javascript" src="jscalendar/lang/calendar-en.js"></script>
+    <script type="text/javascript">
+
+    _dynarch_popupCalendar = null;
+
+    // Set the select option by value.
+    function setSelectOption(select, optionValue) {
+      for(var i = 0; i < select.options.length; i++) {
+        if(select.options[i].value == optionValue) {
+          select.options[i].selected = true;
+          break;
+        }
+      }
+    }
+
+    // Calendar onSelect handler. This object contains the element IDs
+    // that are used to set the date and the onSelect function.
+    CalendarSelectHandler = function (yearId, monthId, dayId) {
+      this.yearId = yearId;
+      this.monthId = monthId;
+      this.dayId = dayId;
+
+      // onSelect handler function for the Calendar object.
+      this.onSelect = function (calendar, date) {
+          if(calendar.dateClicked) {
+          var year = document.getElementById(yearId);
+          if(year)
+            setSelectOption(year,calendar.date.getFullYear());
+          var month = document.getElementById(monthId);
+          if(month)
+            setSelectOption(month, (calendar.date.getMonth() + 1));
+          var day = document.getElementById(dayId);
+          if(day)
+            setSelectOption(day, calendar.date.getDate());
+          closeHandler(calendar);
+        }
+      }
+    }
+
+    // Close the calendar
+    function closeHandler(cal) {
+      cal.hide();
+      _dynarch_popupCalendar = null;
+    }
+
+    // Show the calendar under the element having the given id.
+    function showCalendar(triggerId, selectHandler) {
+
+      if(!document.getElementById)
+        return; // do nothing if function is not supported.
+
+      var trigger = document.getElementById(triggerId);
+      var year = document.getElementById(selectHandler.yearId);
+      var month = document.getElementById(selectHandler.monthId);
+      var day = document.getElementById(selectHandler.dayId);
+      var aday = new Date();
+
+      if (_dynarch_popupCalendar != null) {
+        // we already have some calendar created
+        _dynarch_popupCalendar.hide();
+      } else {
+        // first-time call, create the calendar.
+        var cal = new Calendar(1, null, selectHandler.onSelect, closeHandler);
+        // uncomment the following line to hide the week numbers
+        // cal.weekNumbers = false;
+        cal.showsOtherMonths = true;
+        _dynarch_popupCalendar = cal;
+
+        var min = aday.getFullYear();
+        var max = min;
+        for(x = 0; x < year.options.length; x++) {
+          var val = year.options[x].value;
+          if(val == 0)
+            continue;
+          if(val > max)
+            max = val;
+          if(val < min)
+            min = val;
+        }
+        cal.setRange(min, max); // min/max year allowed.
+        cal.create();
+      }
+
+      if(year.value && year.value > 0)
+        aday.setFullYear(year.value);
+      if(month.value && month.value > 0)
+        aday.setMonth(month.value - 1);
+      if(day.value && day.value > 0)
+        aday.setDate(day.value);
+
+      _dynarch_popupCalendar.setDate(aday);
+
+      _dynarch_popupCalendar.showAtElement(trigger);
+
+      return false;
+    }
+
+    </script>
+
+    <?php
+  }
+?>
Index: core/date_api.php
===================================================================
RCS file: /cvsroot/mantisbt/mantisbt/core/date_api.php,v
retrieving revision 1.7
diff -u -r1.7 date_api.php
--- core/date_api.php	26 Feb 2005 01:00:39 -0000	1.7
+++ core/date_api.php	12 Jun 2005 06:41:30 -0000
@@ -92,6 +92,7 @@
 	# --------------------
 
 	function print_date_selection_set( $p_name, $p_format, $p_date=0, $p_default_disable=false, $p_allow_blank=false, $p_year_start=0, $p_year_end=0) {
+
 		$t_chars = preg_split('//', $p_format, -1, PREG_SPLIT_NO_EMPTY) ;
 		if ( $p_date != 0 ) {
 			$t_date = preg_split('/-/', date( 'Y-m-d', $p_date), -1, PREG_SPLIT_NO_EMPTY) ;
@@ -107,33 +108,53 @@
 		if ( $p_allow_blank == true ) {
 			$t_blank_line = "<option value=\"0\"></option>" ;
 		}
-
+    $t_month_id = $p_name . "_month";
+    $t_day_id = $p_name . "_day";
+    $t_year_id = $p_name . "_year";
 		foreach( $t_chars as $t_char ) {
 			if (strcmp( $t_char, "M") == 0) {
-				echo "<select name=\"" . $p_name . "_month\" $t_disable>" ;
+				echo "<select id=\"" . $t_month_id  . "\" name=\"" . $t_month_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_month_option_list( $t_date[1] ) ;
 				echo "</select>\n" ;
 			}
 			if (strcmp( $t_char, "m") == 0) {
-				echo "<select name=\"" . $p_name . "_month\" $t_disable>" ;
+				echo "<select  id=\"" . $t_month_id  . "\" name=\"" . $t_month_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_numeric_month_option_list( $t_date[1] ) ;
 				echo "</select>\n" ;
 			}
 			if (strcasecmp( $t_char, "D") == 0) {
-				echo "<select name=\"" . $p_name . "_day\" $t_disable>" ;
+				echo "<select id=\"" . $t_day_id . "\" name=\"" . $t_day_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_day_option_list( $t_date[2] ) ;
 				echo "</select>\n" ;
 			}
 			if (strcasecmp( $t_char, "Y") == 0) {
-				echo "<select name=\"" . $p_name . "_year\" $t_disable>" ;
+				echo "<select id=\"" . $t_year_id . "\" name=\"" . $t_year_id . "\" $t_disable>" ;
 				echo $t_blank_line ;
 				print_year_range_option_list( $t_date[0], $p_year_start, $p_year_end ) ;
 				echo "</select>\n" ;
 			}
 		}
+
+    # Include jscalendar if configured
+    if ( config_get('date_use_calendar') == ON) {
+      $t_calendar_title = lang_get('calendar_title');
+      $t_cal_name = $p_name . "_calendar";
+      $t_cal_object_name = $t_cal_name . "_object";
+      
+      # Can't disable/enable buttons
+      #echo "<button id=\"$t_cal_name\" type=\"button\" name=\"$t_cal_name\" value=\"...\" ";
+      #echo " title=\"$t_calendar_title\" ";
+      #echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('$t_year_id', '$t_month_id', '$t_day_id'))\" $t_disable>";
+      #echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\"> </button> \n";
+      
+      # 
+      echo "<span id=\"$t_cal_name\" title=\"$t_calendar_title\" ";
+      echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('$t_year_id', '$t_month_id', '$t_day_id'))\" >";
+      echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\" > </span> \n";
+    }
 	}
 
 ?>
Index: core/filter_api.php
===================================================================
RCS file: /cvsroot/mantisbt/mantisbt/core/filter_api.php,v
retrieving revision 1.116
diff -u -r1.116 filter_api.php
--- core/filter_api.php	7 Jun 2005 19:49:53 -0000	1.116
+++ core/filter_api.php	12 Jun 2005 06:41:30 -0000
@@ -2716,21 +2716,39 @@
 			$t_chars = preg_split( '//', config_get( 'short_date_format' ), -1, PREG_SPLIT_NO_EMPTY );
 			foreach( $t_chars as $t_char ) {
 				if ( strcasecmp( $t_char, "M" ) == 0 ) {
-					print "<select name=\"start_month\" $t_menu_disabled>";
+					print "<select id=\"start_month\" name=\"start_month\" $t_menu_disabled>";
 					print_month_option_list( $t_filter['start_month'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "D" ) == 0 ) {
-					print "<select name=\"start_day\" $t_menu_disabled>";
+					print "<select id=\"start_day\" name=\"start_day\" $t_menu_disabled>";
 					print_day_option_list( $t_filter['start_day'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "Y" ) == 0 ) {
-					print "<select name=\"start_year\" $t_menu_disabled>";
+					print "<select id=\"start_year\" name=\"start_year\" $t_menu_disabled>";
 					print_year_option_list( $t_filter['start_year'] );
 					print "</select>\n";
 				}
 			}
+
+      # Include jscalendar if configured
+      if ( config_get('date_use_calendar') == ON) {
+        $t_calendar_title = lang_get('calendar_title');
+        $t_cal_name = "start_date_calendar";
+        $t_cal_object_name = $t_cal_name . "_object";
+        
+        # Can't disable/enable buttons
+        #echo "<button id=\"$t_cal_name\" type=\"button\" name=\"$t_cal_name\" value=\"...\" ";
+        #echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('start_year', 'start_month', 'start_day'))\" $t_menu_disable>";
+        #echo "<img src=\"/jscalendar/img.gif\" alt=\"calendar\"> </button> \n";
+        
+        # 
+        echo "<span id=\"$t_cal_name\" title=\"$t_calendar_title\" ";
+        echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('start_year', 'start_month', 'start_day'))\" >";
+        echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\" > </span> \n";
+      }
+
 			?>
 			</td>
 		</tr>
@@ -2744,21 +2762,39 @@
 			$t_chars = preg_split( '//', config_get( 'short_date_format' ), -1, PREG_SPLIT_NO_EMPTY );
 			foreach( $t_chars as $t_char ) {
 				if ( strcasecmp( $t_char, "M" ) == 0 ) {
-					print "<select name=\"end_month\" $t_menu_disabled>";
+					print "<select id=\"end_month\" name=\"end_month\" $t_menu_disabled>";
 					print_month_option_list( $t_filter['end_month'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "D" ) == 0 ) {
-					print "<select name=\"end_day\" $t_menu_disabled>";
+					print "<select id=\"end_day\" name=\"end_day\" $t_menu_disabled>";
 					print_day_option_list( $t_filter['end_day'] );
 					print "</select>\n";
 				}
 				if ( strcasecmp( $t_char, "Y" ) == 0 ) {
-					print "<select name=\"end_year\" $t_menu_disabled>";
+					print "<select id=\"end_year\" name=\"end_year\" $t_menu_disabled>";
 					print_year_option_list( $t_filter['end_year'] );
 					print "</select>\n";
 				}
 			}
+
+      # Include jscalendar if configured
+      if ( config_get('date_use_calendar') == ON) {
+        $t_calendar_title = lang_get('calendar_title');
+        $t_cal_name = "end_date_calendar";
+        $t_cal_object_name = $t_cal_name . "_object";
+        
+        # Can't disable/enable buttons
+        #echo "<button id=\"$t_cal_name\" type=\"button\" name=\"$t_cal_name\" value=\"...\" ";
+        #echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('end_year', 'end_month', 'end_day'))\" $t_menu_disable>";
+        #echo "<img src=\"/jscalendar/img.gif\" alt=\"calendar\"> </button> \n";
+        
+        # 
+        echo "<span id=\"$t_cal_name\" title=\"$t_calendar_title\" ";
+        echo " onclick=\"showCalendar('$t_cal_name', new CalendarSelectHandler('end_year', 'end_month', 'end_day'))\" >";
+        echo "<img src=\"/jscalendar/img.gif\" alt=\"$t_calendar_title\" > </span> \n";
+      }
+
 			?>
 			</td>
 		</tr>
patch-update1.txt (11,740 bytes)   

Relationships

duplicate of 0008957 assignedsyncguru Date Selector for Custom Fields 
has duplicate 0012427 closedatrol Calendar in Dates Selection 

Activities

russ

russ

2005-06-12 03:37

reporter   ~0010487

I just noticed that the inclusion of "jscalendar/calendar-setup.js" file in the meta_inc.php patch is not needed since my patch doesn't use code from this file.

Also, the supported browsers for this widget are:

  • Internet Explorer 5.0+ for Windows
  • Mozilla, Netscape 7.x, Mozilla FireFox (any platform)
  • Other Gecko-based browsers (any platform)
  • Konqueror 3.2+ for Linux
  • Apple Safari for Macintosh
  • Opera 7+ (any platform)
russ

russ

2005-06-12 19:57

reporter   ~0010490

The javascript to update the date did not work in Konqueror. I updated the javscript in meta_inc.php. I will upload the new file.