← Back to team overview

yahoo-eng-team team mailing list archive

[Bug 1364649] [NEW] Calendar widget does not display in front of modals

 

Public bug reported:

When the calendar widget is used on a field that is displayed in a
modal, the widget displays behind the modal so you can't see it.  None
of the fields that use a calendar widget is currently displayed on a
modal so this has not been an issue.  I encountered the problem when
extending horizon with a custom panel that uses a modal with a calendar
widget on it.

To recreate, the datepicker must be initialized on modal init, and a
date field needs to be added to a modal form.  For example I added the
following fields to the Admin -> Create Network form.  The datepicker
init code keys off the start and end field IDs so it's easiest to just
use those names.

    start = forms.DateField(label=_("Start date"), required=False,
                                 input_formats=("%Y-%m-%d",),
                                 widget=forms.DateInput(attrs={
                                     'data-date-format': 'yyyy-mm-dd'}))
    end = forms.DateField(label=_("End date"), required=True,
                          input_formats=("%Y-%m-%d",),
                               widget=forms.DateInput(attrs={
                                   'data-date-format': 'yyyy-mm-dd'}))

Initialize the datepicker on modal init somewhere in the javascript:

    horizon.modals.addModalInitFunction(horizon.forms.datepicker);

When you open the Create Network form and click in the Start date or End
date fields you can see the calendar partly showing underneath the
modal.

** Affects: horizon
     Importance: Undecided
     Assignee: Justin Pomeroy (jpomero)
         Status: New


** Tags: bootstrap

** Changed in: horizon
     Assignee: (unassigned) => Justin Pomeroy (jpomero)

-- 
You received this bug notification because you are a member of Yahoo!
Engineering Team, which is subscribed to OpenStack Dashboard (Horizon).
https://bugs.launchpad.net/bugs/1364649

Title:
  Calendar widget does not display in front of modals

Status in OpenStack Dashboard (Horizon):
  New

Bug description:
  When the calendar widget is used on a field that is displayed in a
  modal, the widget displays behind the modal so you can't see it.  None
  of the fields that use a calendar widget is currently displayed on a
  modal so this has not been an issue.  I encountered the problem when
  extending horizon with a custom panel that uses a modal with a
  calendar widget on it.

  To recreate, the datepicker must be initialized on modal init, and a
  date field needs to be added to a modal form.  For example I added the
  following fields to the Admin -> Create Network form.  The datepicker
  init code keys off the start and end field IDs so it's easiest to just
  use those names.

      start = forms.DateField(label=_("Start date"), required=False,
                                   input_formats=("%Y-%m-%d",),
                                   widget=forms.DateInput(attrs={
                                       'data-date-format': 'yyyy-mm-dd'}))
      end = forms.DateField(label=_("End date"), required=True,
                            input_formats=("%Y-%m-%d",),
                                 widget=forms.DateInput(attrs={
                                     'data-date-format': 'yyyy-mm-dd'}))

  Initialize the datepicker on modal init somewhere in the javascript:

      horizon.modals.addModalInitFunction(horizon.forms.datepicker);

  When you open the Create Network form and click in the Start date or
  End date fields you can see the calendar partly showing underneath the
  modal.

To manage notifications about this bug go to:
https://bugs.launchpad.net/horizon/+bug/1364649/+subscriptions


Follow ups

References