Drupal - Automatically Set "To date" when "From date" Changes on Popup Calendar

With a date field in Drupal, you can specify the 'To date' be the same as the 'From date' on the field settings. However, selecting a 'From date' on a node form does not automatically update the 'To date' to be the same value, and this is usually annoying for our patrons. Let's use some javascript to detect changes on our 'From date' field(s), then automatically set the 'To date' to the same date as the 'From date'.

Place this code in your custom javascript file:

(function ($, Drupal, window, document, undefined) {jQuery(document).ready(function(){
      // When the 'from date' is changed on the following date fields, set
      // the 'to date' equal to the 'from date'.
      var date_fields_default_to_from = new Array(
        'field_event_date',
        'field_event_date_range'
      );
      var css_selector = '';
      $.each(date_fields_default_to_from, function(index, field){
          css_selector += '#edit-' + field.replace(/_/g,'-') + '-und-0-value-datepicker-popup-0, ';
      });
      css_selector = css_selector.substring(0, css_selector.length - 2); // Remove last ', '
      $(css_selector).change(function(){
          $('#' + $(this).attr('id').replace(/value/g, 'value2')).val($(this).val());
      });
});})(jQuery, Drupal, this, this.document);

Any field machine name(s) we specify in the date_field_default_to_from array will automatically have its 'To date' set to the value of 'From date', whenever the 'From date' value changes.

For Drupal 6, the css selector is slightly different (because there is no "und" language code, so use this line instead:

css_selector += '#edit-' + field.replace(/_/g,'-') + '-0-value-datepicker-popup-0, ';