StudentUniverse angular date range picker

Raw month picker picker

  • date is required and is used to track which month is displayed.
  • clickCallback will be called with the date that was clicked.
  • dateDisabled callback will be called to determine if date is enabled.
  • customClass callback will be called to set custom styles.
  • cheapMousernterCallback will be called when a date is hovered. Callback must trigger $digest manually for performance reasons.

If you need further customizations you can use su-datepicker-month directive.


Default datepicker encompasses the raw month picker logic

  • The date will not change by changing month.
  • Date change is expected to be one way using the datepicker.
  • Using disable-past attribute will disable dates less than today.
  • Custom date disabled logic can be used by supplying a is-date-disabled callback.
  • Custom date click callback can be used by supplying a select-date callback.
  • Custom mouseenter logic can be used by supplying cheap-mouseenter-callback.
  • Custom date class logic can be used by supplying custom-class callback.

Custom template can be used by adding template-url attribute.


Default date range picker encompasses the raw month picker logic

  • The date will not change by changing month.
  • Date change is expected to be one way using the datepicker.
  • Using disable-past attribute will disable dates less than today.
  • Custom date disabled logic can be used by supplying a is-date-disabled callback.
  • Custom date click callback can be used by supplying a select-date callback.
  • Custom mouseenter logic can be used by supplying cheap-mouseenter-callback.
  • Custom date class logic can be used by supplying custom-class callback.

Example popup datepicker