Changeset 7956


Ignore:
Timestamp:
Jun 2, 2021, 11:17:20 AM (6 months ago)
Author:
Nicklas Nordborg
Message:

References #2252: Drop-down filters in tables display at incorrect location

This was accidentally checked in to the trunk. Copying to 3.18-stable.

Location:
branches/3.18-stable
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • branches/3.18-stable

    • Property svn:mergeinfo changed
      /trunk (added)merged: 7955
  • branches/3.18-stable/www/include/scripts/main-2.js

    r7928 r7956  
    39403940    // Position the dropdown div relative the  main element
    39413941    var fpos = Doc.getElementPosition(element);
    3942 
    39433942    var dpos = {};
    39443943
     
    39583957      {
    39593958        // Now we must check if we end up outside the right side of
    3960         // the browser window, find the parent <div class="data"> element
    3961         // or document.body
     3959        // the browser window, find the parent <div class="itemlist"> element
     3960        // or document.body to get the viewport width. We also need the
     3961        // full width of the table which we get from the <tr class="headerrow"> element
     3962        // Sticky headers complicates everything since this causes the <thead>
     3963        // to have it's own positioning context
    39623964        var p = element.parentNode;
    3963         while (p != null && p.tagName != 'DIV' && p.className != 'data')
     3965        var tr = null;
     3966        var divData = null;
     3967        var stickyHeaders = false;
     3968        while (p != null)
    39643969        {
     3970          if (p.tagName == 'TR' && p.classList.contains('headerrow')) tr = p;
     3971          if (p.tagName == 'DIV' && p.classList.contains('data')) divData = p;
     3972          if (p.tagName == 'DIV' && p.classList.contains('sticky-headers')) stickyHeaders = true;
    39653973          p = p.parentNode;
    39663974        }
    3967         if (p==null) p = document.body;
     3975        if (divData==null) divData = document.body;
     3976        if (tr==null) tr = divData;
    39683977
    39693978        // Get position data for the parent
    39703979        // +16 should be safe to account for a scrollbar
    3971         var ppos = Doc.getElementPosition(p);
    3972         var scrollbar = p.scrollHeight > p.clientHeight ? 16 : 0;
    3973         var maxRight = ppos.width + p.scrollLeft - scrollbar;
    3974 
     3980        var dataPos = Doc.getElementPosition(divData);
     3981        var trPos = Doc.getElementPosition(tr);
     3982       
     3983        var scrollbar = divData.scrollHeight > divData.clientHeight ? 16 : 0;
     3984        var maxRight = dataPos.width + divData.scrollLeft - scrollbar;
    39753985        dpos.width = 'auto';
    39763986        dpos.maxWidth = '300px';
     
    39793989          // Align to right
    39803990          dpos.left = 'auto';
    3981           dpos.right = (ppos.right-fpos.right-scrollbar)+'px';
     3991          if (stickyHeaders)
     3992          {
     3993            dpos.right = (trPos.right-fpos.right)+'px';
     3994          }
     3995          else
     3996          {
     3997            dpos.right = (dataPos.right-fpos.right-scrollbar)+'px';
     3998          }
    39823999          if (fpos.right > maxRight)
    39834000          {
    39844001            // And adjust scroll position if needed
    3985             p.scrollLeft += fpos.right - maxRight;
     4002            divData.scrollLeft += fpos.right - maxRight + scrollbar;
    39864003          }
    39874004        }
  • branches/3.18-stable/www/include/styles/table.css

    r7936 r7956  
    499499{
    500500  border-collapse: separate;
     501  /* Hack to get around problem with positioning drop-down selection lists */
     502  /* when the brower doesn't support 'position: sticky' in <thead> elements */
     503  /* see ticket #2252 */
     504  position: relative;
    501505}
    502506
Note: See TracChangeset for help on using the changeset viewer.