Scrollbars in Crosstab table

PHPMaker User Submitted Tips (PHPMaker)
1 
// Page Render event
function Page_Render()
{
  echo '<style>
    /* 1) Scrollpane */
    .ew-grid-middle-panel {
        max-height: 80vh;
        overflow-x: auto;
        overflow-y: auto;
    }
    /* 2) Eerste kolom sticky */
    .ew-grid-middle-panel th:first-child,
    .ew-grid-middle-panel td:first-child {
        position: sticky;
        left: 0;
        z-index: 4; /* boven de body, onder headers */
    }
  
     </style>';
  
    echo '<script>
    document.addEventListener("DOMContentLoaded", function() {
        var panel = document.querySelector(".ew-grid-middle-panel");
        if (!panel) return;
        var table = panel.querySelector("table");
        if (!table || !table.tHead || table.tHead.rows.length < 2) return;
        var row1 = table.tHead.rows[0];
        var row2 = table.tHead.rows[1];
        // Meet de hoogte van de eerste header‑rij
        var h1 = row1.getBoundingClientRect().height;
        // Maak alle TH in rij1 sticky
        Array.from(row1.cells).forEach(function(th) {
            th.style.position = "sticky";
            th.style.top = "0px";
            th.style.zIndex = "6"; // boven alles
        });
        // Maak alle TH in rij2 sticky, net onder rij1
        Array.from(row2.cells).forEach(function(th) {
            th.style.position = "sticky";
            th.style.top = h1 + "px";
            th.style.zIndex = "5"; // nét onder rij1
        });
    });
    </script>';
}