0

Fix Footer for inside Scroll html

Hi Mikro, need yo fix the footer for scroll inside, something wrong or missing

let table := ((select Disciplines where 'Budget Discipline' > 0) order by -'Budget Discipline');
let css := "
<style>
table {
    width:100%;
    background-color: White;
}
.tableFixHead {
        overflow-y: auto;
        height: 265px;
        }
th {
    text-align:center;
    background-color: LightGray;
}
td,th{
    font-size: small;
    padding: .1em .5em .1em .5em;
}
td {
    background-color: GhostWhite;
}
tr:nth-child(odd) td{
      background-color: White;
}
td:nth-of-type(2) , td:nth-of-type(2), td:nth-of-type(3), td:nth-of-type(4), td:nth-of-type(5), td:nth-of-type(6), td:nth-of-type(7) {
    text-align:center;
}
thead {
    position: sticky;
    top: -.3em;
    text-align:center;
}
</style>";
let content := "
    <div class='tableFixHead'>
<table>
    <thead>
        <tr>
            <th> Discipline </th>
            <th> Weight Budget </th>
            <th> Budget Discipline</th>
            <th> Plan Value </th>
            <th> Eaned Value </th>
            <th> Progress Plan </th>
            <th> Progress Real </th>
        </tr>
    </thead>
    <tbody>
" +
    table.("
        <tr>
            <td> " +
    Discipline +
    " </td>
                       <td> " +
    'Weight Budget' +
    " </td>
<td> " +
    'Budget Discipline' +
    " </td>
<td> " +
    'Plan Value' +
    " </td>
<td style=background-color:" +
    switch true do
    case 'Earned Value' > 'Plan Value':
        "DarkOliveGreen"
    case 'Earned Value' < 'Plan Value':
        "#d36e70"
    case 'Earned Value' = 'Plan Value':
        "#ffffc0"
    end +
    "> " +
    'Earned Value' +
    " </td>
<td> " +
    'Plan Value %' +
    " </td>
<td> " +
    'Earned Value %' +
    " </td>

        ") +
    "
    </tbody>
<tfoot>
<tr>
     <th style = text-align:left>#<sub>filter </sub> = " +
    cnt(table['Budget Discipline' > 0]) +
    "</th>
<th style = text-align:center scope='colgroup' colspan='1' >∑<sub>total </sub> = " +
    sum(table.'Weight Budget') +
    "</th>
<th style = text-align:center scope='colgroup' colspan='1' >∑<sub>total </sub> = " +
    sum(table.'Budget Discipline') +
    "</th>
<th style = text-align:center scope='colgroup' colspan='1' >∑<sub>toal </sub> = " +
    sum(table.'Plan Value') +
    "</th>
<th style = text-align:center scope='colgroup' colspan='1' >∑<sub>total </sub> = " +
    sum(table.'Earned Value') +
    "</th>
<th style = text-align:center scope='colgroup' colspan='2' >  " +
    "</th>
</tfoot>
</table>
</dic>
";
html(css + content)

3 Antworten

null
    • mirko3
    • vor 6 Monaten
    • Gemeldet - anzeigen

    Hi Rafael. Try this in css...

    thead,tfoot{
        position: sticky;
        font-size:small;
    }
    thead {
        top: -.3em;
        text-align:center;
    }
    tfoot{bottom: -.3em;}
    

    instead of...

    thead {
        position: sticky;
        top: -.3em;
        text-align:center;
    }

    Mirko

      • Rafael_Sanchis
      • vor 6 Monaten
      • Gemeldet - anzeigen

       👍 Perfect Mirko Thanks.

      • Rafael_Sanchis
      • vor 4 Monaten
      • Gemeldet - anzeigen

       

      Hi Mirko

      One question there are some option to group by Disciplines and consolidate he sum for each other elements, this is part script.

      <table>
          <thead>
              <tr>
                  <th> Discipline </th>            
                   <th> Hours by Catg.</th>
                    <th> Budget by Catg. </th>
                    <th> P7 </th>
                     <th> P6 </th>
                     <th> P3 </th>    
                      <th> T4 </th>                            
              </tr>
          </thead>
          <tbody>
      " +
          table.("
              <tr>
                  <td> " +
          text('Disciplines_>'.Discipline) +
          " </td>                        

Content aside

  • Status Answered
  • vor 4 MonatenZuletzt aktiv
  • 3Antworten
  • 87Ansichten
  • 2 Folge bereits