How to make this table scrollable

Question

I am trying to make my outfile a scrollable when I echo it to the screen. Here is the code and I am new at this but I only need the data scrollable and not the section I have bolded.

<table border=\"0\" class=\"text-small_plus\" width='100%' bgcolor=white bordercolor='black' cellspacing='2' cellpadding='2' style='border-collapse:collapse;
border:none;mso-border-alt:solid windowtext .5pt;mso-padding-alt:0in 5.4pt 0in 5.4pt'>");

if(!empty($assignment_file)){
    echo ("<tr valign=\"bottom\" bgcolor=\"silver\" style=\"font-weight: bold;\"><td width=\"10\">#</td><td>Clt File Num</td><td>Clt Addr</td><td>Clt City</td>
    <td>Clt Zip</td><td>Clt County</td><td>Split County</td><td>VenueCode</td><td>Assigned Court</td>
    <td>Debt Amt</td>");

    if($open_close == "A"){ echo ("<td>Status</td>");}
    if($open_close == "M"){ echo ("<td>Status</td><td>Complete</td><td>Unassign</td><td>Reject</td>");}
    if($open_close == "W"){ echo ("<td>Status</td><td>Unassign</td>");}
    if($open_close == "Y"){ echo ("<td>Status</td><td>Re-Open</td>");}
    if($open_close == "P"){ echo ("<td>Status</td><td>Re-Open</td>");}**



    if (file_exists($itm_filename)) {
        system ("cat $itm_filename");
        }
    echo ("</table>");

Define "scrollable". This should scroll just fine, barring CSS that's cutting off overflown content. Can you give a better example of what this looks like, and how you want it to work? — ceejayoz, Oct 17 '17 at 16:08
It does scroll vertically but I need the to not scroll with the data. I hope I am making sense. This is what I need to not scroll with the data — Tobin, Oct 17 '17 at 16:13
echo ("#Clt File NumClt AddrClt City Clt ZipClt CountySplit CountyVenueCodeAssigned Court Debt Amt"); — Tobin, Oct 17 '17 at 16:13
So I echo the "Header" and then echo if there's data the file — Tobin, Oct 17 '17 at 16:14
Google "sticky header" and you'll find a whole bunch of JavaScript solutions. — ceejayoz, Oct 17 '17 at 16:15

score 0 · Answer 1 · answered Oct 17 '17 at 16:15

0

Use table inside a div element Like:

<style>
    .divClass
    {
        height:100px;
        overflow:scroll;
    }
</style>

<div class="divClass">
    <table>
        <tr>
            <td>demo</td>
        </tr>
    </table>
</div>

answered Oct 17 '17 at 16:15

Pintu Kumar

1
3

I currently have this in the style – Tobin Oct 17 '17 at 16:17
.scroll-table{ height: 700px; overflow: auto; } – Tobin Oct 17 '17 at 16:17
So that works but the "header" still scrolls with it – Tobin Oct 17 '17 at 16:20
May be It helps to you [https://stackoverflow.com/questions/8423768/freeze-the-top-row-for-an-html-table-only-fixed-table-header-scrolling](https://stackoverflow.com/questions/8423768/freeze-the-top-row-for-an-html-table-only-fixed-table-header-scrolling) – Pintu Kumar Oct 17 '17 at 16:30

How to make this table scrollable

1 Answers1