Moodle
  1. Moodle
  2. MDL-32297

date_time_selector popup is too constrained

    Details

    • Testing Instructions:
      Hide

      Test pre-requisites

      • This test has to be done on different themes (the more the better)

      Test steps

      1. Go to Navigation > Site pages > Calendar and click on 'New event'
      2. Click to edit the date
      3. Make sure the date selector does not overlap with the dropdown menu
      4. Using Firebug, edit the HTML and remove the fields 'Type of event', 'Name' and 'Description'.
      5. Click to edit the date
      6. Make sure the date selector does not overlap with the dropdown menu

      (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)

      Show
      Test pre-requisites This test has to be done on different themes (the more the better) Test steps Go to Navigation > Site pages > Calendar and click on 'New event' Click to edit the date Make sure the date selector does not overlap with the dropdown menu Using Firebug, edit the HTML and remove the fields 'Type of event', 'Name' and 'Description'. Click to edit the date Make sure the date selector does not overlap with the dropdown menu (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)
    • Workaround:
      Hide

      Change constraint from form to body:

      lib/form/yui/dateselector/dateselector.js
      fix_position : function() {
        if (this.currentowner) {
          // this.panel.set('constrain', this.currentowner.get('node').ancestor('form'));
          this.panel.set('constrain', this.currentowner.get('node').ancestor('body'));
          this.panel.set('align', {
            node:this.currentowner.get('node').one('select'),
            points:[Y.WidgetPositionAlign.BL, Y.WidgetPositionAlign.TL]
          });
        }
      },
      
      Show
      Change constraint from form to body: lib/form/yui/dateselector/dateselector.js fix_position : function() { if ( this .currentowner) { // this .panel.set('constrain', this .currentowner.get('node').ancestor('form')); this .panel.set('constrain', this .currentowner.get('node').ancestor('body')); this .panel.set('align', { node: this .currentowner.get('node').one('select'), points:[Y.WidgetPositionAlign.BL, Y.WidgetPositionAlign.TL] }); } },
    • Affected Branches:
      MOODLE_22_STABLE
    • Fixed Branches:
      MOODLE_22_STABLE, MOODLE_23_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-32297-master
    • Rank:
      39093

      Description

      The date_time_selector has a javascript calendar popup, this works ok, unless the date_time_selector is one of the top elements of the form.
      The popup is constrained by the form area, but this is too restricted for some cases.

      I've added a picture of the form constrain, and one where it has been replaced by the body element (simple fix).

        Issue Links

          Activity

          Esben Sune Rasmussen created issue -
          Esben Sune Rasmussen made changes -
          Field Original Value New Value
          Description The date_time_selector has a javascript calendar popup, this works ok, unless the date_time_selector is one of the top elements of the form.
          The popup is constrained by the form area, but this is too restricted for some cases.


          {code:title=lib/form/yui/dateselector/dateselector.js|borderStyle=solid}
          fix_position : function() {
            if (this.currentowner) {
              // this.panel.set('constrain', this.currentowner.get('node').ancestor('form'));
              this.panel.set('constrain', this.currentowner.get('node').ancestor('body'));
              this.panel.set('align', {
                node:this.currentowner.get('node').one('select'),
                points:[Y.WidgetPositionAlign.BL, Y.WidgetPositionAlign.TL]
              });
            }
          },
          {code}

          The date_time_selector has a javascript calendar popup, this works ok, unless the date_time_selector is one of the top elements of the form.
          The popup is constrained by the form area, but this is too restricted for some cases.

          I've added a picture of the form constrain, and one where it has been replaced by the body element (simple fix).
          Workaround Change constraint from form to body:

          {code:title=lib/form/yui/dateselector/dateselector.js|borderStyle=solid}
          fix_position : function() {
            if (this.currentowner) {
              // this.panel.set('constrain', this.currentowner.get('node').ancestor('form'));
              this.panel.set('constrain', this.currentowner.get('node').ancestor('body'));
              this.panel.set('align', {
                node:this.currentowner.get('node').one('select'),
                points:[Y.WidgetPositionAlign.BL, Y.WidgetPositionAlign.TL]
              });
            }
          },
          {code}
          Attachment popup_body_constrained.png [ 27794 ]
          Attachment popup_form_constrained.png [ 27795 ]
          Michael de Raadt made changes -
          Fix Version/s STABLE backlog [ 10463 ]
          Labels patch triaged
          Michael de Raadt made changes -
          Link This issue has been marked as being related by MDL-33771 [ MDL-33771 ]
          Michael de Raadt made changes -
          Link This issue has been marked as being related by MDL-26649 [ MDL-26649 ]
          Frédéric Massart made changes -
          Fix Version/s STABLE Sprint 22 [ 12156 ]
          Fix Version/s STABLE backlog [ 10463 ]
          Assignee moodle.com [ moodle.com ] Frédéric Massart [ fred ]
          Frédéric Massart made changes -
          Status Open [ 1 ] Waiting for peer review [ 10012 ]
          Pull Master Diff URL https://github.com/FMCorz/moodle/compare/master...MDL-32297-master
          Pull 2.3 Diff URL https://github.com/FMCorz/moodle/compare/MOODLE_23_STABLE...MDL-32297-23
          Pull Master Branch MDL-32297-master
          Pull from Repository git://github.com/FMCorz/moodle.git
          Pull 2.2 Diff URL https://github.com/FMCorz/moodle/compare/MOODLE_22_STABLE...MDL-32297-22
          Pull 2.2 Branch MDL-32297-22
          Pull 2.3 Branch MDL-32297-23
          Frédéric Massart made changes -
          Testing Instructions # Do to the form to add a new assignment 2.2 online text to an activity
          # Inspect the HTML and delete the <divs id="fitem_id_*"> above 'Available from', so that the date is the first element of the fieldset
          # Click the date field to display date selector
          # Make sure the date selector does not overlap with the dropdown menu

          (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)
          Rajesh Taneja made changes -
          Original Estimate 0 minutes [ 0 ]
          Remaining Estimate 0 minutes [ 0 ]
          Status Waiting for peer review [ 10012 ] Peer review in progress [ 10013 ]
          Peer reviewer rajeshtaneja
          Rajesh Taneja made changes -
          Status Peer review in progress [ 10013 ] Waiting for integration review [ 10010 ]
          Frédéric Massart made changes -
          Testing Instructions # Do to the form to add a new assignment 2.2 online text to an activity
          # Inspect the HTML and delete the <divs id="fitem_id_*"> above 'Available from', so that the date is the first element of the fieldset
          # Click the date field to display date selector
          # Make sure the date selector does not overlap with the dropdown menu

          (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)
          # Go to Navigation > Site pages > Calendar and click on 'New event'
          # Click to edit the date
          # Make sure the date selector does not overlap with the dropdown menu
          # Using Firebug, edit the HTML and remove the fields 'Type of event', 'Name' and 'Description'.
          # Click to edit the date
          # Make sure the date selector does not overlap with the dropdown menu

          (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)
          Dan Poltawski made changes -
          Link This issue is duplicated by MDL-34168 [ MDL-34168 ]
          Sam Hemelryk made changes -
          Currently in integration Yes [ 10041 ]
          Sam Hemelryk made changes -
          Status Waiting for integration review [ 10010 ] Integration review in progress [ 10004 ]
          Integrator samhemelryk
          Sam Hemelryk made changes -
          Status Integration review in progress [ 10004 ] Waiting for testing [ 10005 ]
          Fix Version/s 2.2.5 [ 12352 ]
          Fix Version/s 2.3.2 [ 12353 ]
          Tim Barker made changes -
          Tester davmon
          David Monllaó made changes -
          Status Waiting for testing [ 10005 ] Testing in progress [ 10011 ]
          David Monllaó made changes -
          Status Testing in progress [ 10011 ] Problem during testing [ 10007 ]
          Frédéric Massart made changes -
          Testing Instructions # Go to Navigation > Site pages > Calendar and click on 'New event'
          # Click to edit the date
          # Make sure the date selector does not overlap with the dropdown menu
          # Using Firebug, edit the HTML and remove the fields 'Type of event', 'Name' and 'Description'.
          # Click to edit the date
          # Make sure the date selector does not overlap with the dropdown menu

          (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)
          *Test pre-requisites*

          - This test has to be done on different themes (the more the better)

          *Test steps*

          # Go to Navigation > Site pages > Calendar and click on 'New event'
          # Click to edit the date
          # Make sure the date selector does not overlap with the dropdown menu
          # Using Firebug, edit the HTML and remove the fields 'Type of event', 'Name' and 'Description'.
          # Click to edit the date
          # Make sure the date selector does not overlap with the dropdown menu

          (This fix won't work when the inputs are closer to <body> but MDL-26649 will take care of it)
          Sam Hemelryk made changes -
          Status Problem during testing [ 10007 ] Integration review in progress [ 10004 ]
          Sam Hemelryk made changes -
          Status Integration review in progress [ 10004 ] Waiting for testing [ 10005 ]
          David Monllaó made changes -
          Status Waiting for testing [ 10005 ] Testing in progress [ 10011 ]
          David Monllaó made changes -
          Status Testing in progress [ 10011 ] Tested [ 10006 ]
          Dan Poltawski made changes -
          Status Tested [ 10006 ] Closed [ 6 ]
          Resolution Fixed [ 1 ]
          Currently in integration Yes [ 10041 ]
          Integration date 12/Jul/12
          moodle.com made changes -
          Fix Version/s STABLE Sprint 21 [ 12155 ]
          Fix Version/s STABLE Sprint 22 [ 12156 ]
          Michael de Raadt made changes -
          Link This issue caused a regression MDL-35675 [ MDL-35675 ]
          Eloy Lafuente (stronk7) made changes -
          Fix Version/s STABLE Sprint 21 [ 12155 ]

            People

            • Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: