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

Action menu items in tables using table_sql are being displayed weirdly

    XMLWordPrintable

    Details

    • Testing Instructions:
      Hide

      Repeat tests in Clean theme and Boost theme in RTL language (English) and RTL language (Hebrew)

       

      1. Go to "Site administration / Users / Privacy and policies / Data requests"
      2. Create a data request for any 3 users.
      3. Go back to the data requests page.
      4. Run cron:

        php admin/cli/cron.php
        

      5. Refresh the data requests page.
      6. Scroll to the end of the data request table
      7. Click on the actions menu for each of the 3 users
      8. Verify the dropdown action menu is visible and all items can be clicked and no additional vertical scroll bars are displayed
      Show
      Repeat tests in Clean theme and Boost theme in RTL language (English) and RTL language (Hebrew)   Go to " Site administration / Users / Privacy and policies / Data requests " Create a data request for any 3 users. Go back to the data requests page. Run cron: php admin/cli/cron.php Refresh the data requests page. Scroll to the end of the data request table Click on the actions menu for each of the 3 users Verify the dropdown action menu is visible and all items can be clicked and no additional vertical scroll bars are displayed
    • Affected Branches:
      MOODLE_33_STABLE, MOODLE_34_STABLE, MOODLE_35_STABLE
    • Fixed Branches:
      MOODLE_33_STABLE, MOODLE_34_STABLE, MOODLE_35_STABLE
    • Pull from Repository:
    • Pull 3.5 Branch:
    • Pull Master Branch:
      MDL-62884-master

      Description

      The action menu items in tables rendered using table_sql are being displayed in such a way that the menu items are being shown inside the container div of the table and cause scrollbars to be shown.

      This has been recently discovered when the data requests table has been changed to use table_sql to accommodate pagination and sorting.

      Removing the 'no-overflow' class in the containing div of the table seems to fix the issue.

      Screenshots below:

      • Boost:
      • Clean:
      • Cloud's school theme, where the effect is more pronounced:

      To reproduce:

      1. Go to "Site administration / Users / Privacy and policies / Data requests"
      2. Create a data request for any user
      3. Go back to the data requests page.
      4. Run cron.

        php admin/cli/cron.php
        

      5. Refresh the data requests page.
      6. Click on the actions menu.
      7. What happens: The action menu items popover is shown floating over the table but inside the containing div of the table, which causes scrollbars to show.

        Attachments

        1. cloud-school-theme.png
          cloud-school-theme.png
          50 kB
        2. clean.png
          clean.png
          58 kB
        3. boost.png
          boost.png
          70 kB
        4. clean-current.png
          clean-current.png
          1.24 MB
        5. clean-minwidth.png
          clean-minwidth.png
          1.21 MB

          Issue Links

            Activity

              People

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

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Fix Release Date:
                  10/Sep/18