Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-70180

Autocomplete suggestions inside modal forms are not visible

Details

    • MOODLE_310_STABLE, MOODLE_311_STABLE, MOODLE_400_STABLE, MOODLE_403_STABLE, MOODLE_404_STABLE
    • MOODLE_main_MDL-70180
    • Hide

      Please test this in Edge, Firefox, Safari and Chrome

      Test the overflow

      1. login as admin
      2. create at least 5 courses and enrol yourself
      3. navigate to the site calendar
      4. click the new event button
      5. on 'type of event' select course
      6. on the course search input click the arrow button
      7. verify you see all 5 courses, the dropdown should overlap the scrollable container

      Test scrolling modal

      1. add a new assignment activity to a course
      2. in the assignment settings page click the 'choose' button for accepted filetypes
      3. verify the action buttons ("Save changes", "Cancel") in the footer area are visible at all times.
      4. verify there is a vertical scrollbar, allowing to view the rest of the content in the modal's body.

      Test autocomplete in longer scrolling modals

      1. As the admin navigate to Site Administration > Users > Privacies and Policies > Data registry
      2. Click the "Edit" button
      3. Select the purposes option
      4. Click the "Plus" button
      5. Click the Lawful bases autocomplete field
      6. Scroll the modal down or up
      7. Verify the dropdown sticks to the autocomplete field when scrolling down
      8. Click the "Sensitive personal.." auto complete field
      9. Scroll the page up and down
      10. *Verify" the dropdown sticks to the autocomplete field unless it reaches the bottom of the browser window, then it will overlap the autocomplete field.
      Show
      Please test this in Edge, Firefox, Safari and Chrome Test the overflow login as admin create at least 5 courses and enrol yourself navigate to the site calendar click the new event button on 'type of event' select course on the course search input click the arrow button verify you see all 5 courses, the dropdown should overlap the scrollable container Test scrolling modal add a new assignment activity to a course in the assignment settings page click the 'choose' button for accepted filetypes verify the action buttons ("Save changes", "Cancel") in the footer area are visible at all times. verify there is a vertical scrollbar, allowing to view the rest of the content in the modal's body. Test autocomplete in longer scrolling modals As the admin navigate to Site Administration > Users > Privacies and Policies > Data registry Click the "Edit" button Select the purposes option Click the "Plus" button Click the Lawful bases autocomplete field Scroll the modal down or up Verify the dropdown sticks to the autocomplete field when scrolling down Click the "Sensitive personal.." auto complete field Scroll the page up and down *Verify" the dropdown sticks to the autocomplete field unless it reaches the bottom of the browser window, then it will overlap the autocomplete field.

    Description

      We have noticed it in the Workplace theme because we have a lot of modal forms but it can be reproduced in core just as well. The suggestions list for autocomplete elements are not visible in the modal forms that have "scrollable=true" and the scrollable behavior is now default (see MDL-60621, fixversion=3.10)

      As admin on a site that has multiple categories, go to the "Calendar" page and create a new category event. You will see this:

      Attachments

        Issue Links

          Activity

            People

              Votes:
              3 Vote for this issue
              Watchers:
              23 Start watching this issue

              Dates

                Created:
                Updated:

                Time Tracking

                  Estimated:
                  Original Estimate - 0 minutes
                  0m
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 1 day, 4 hours, 36 minutes
                  1d 4h 36m