This discussion is archived
2 Replies Latest reply: Aug 23, 2011 6:47 PM by Luis Cabral RSS

#PAGINATION# in the report template

Luis Cabral Pro
Currently Being Moderated
Hi there,

(Apex 4.0.1)

I am modifying the Standard, Alternating Row Colors report template, and in the After Rows sections I put:
<tr><td class="pwc_ReportHeader">#PAGINATION#</td></tr></table>
</table>
In other words, I want the pagination to be displayed in the last row in the table, using a specific style.

However, this is what is generated in the page:
<tr>
  <td class="pwc_ReportHeader">
    <tr>
      <td colspan="7" align="right" >
        <table summary="">
          <tr>
            <td class="pagination"></td>
            <td class="pagination"></td>
            <td nowrap="nowrap" class="pagination"><span>1 - 2</span></td>
            <td class="pagination"></td>
            <td class="pagination"></td>
          </tr>
        </table>
      </td>
    </tr>
  </td>
</tr>
As you can see, it replaced the #PAGINATION# placeholder with a table inside a tr, which completely messes up the layout I want. These tags don't even have IDs or classes associated to them so it is impossible to style them using CSS.

Where did those tr and table come from? Is it possible to change what is generated?

Thanks
Luis
  • 1. Re: #PAGINATION# in the report template
    fac586 Guru
    Currently Being Moderated
    Luis Cabral wrote:
    In other words, I want the pagination to be displayed in the last row in the table, using a specific style.

    However, this is what is generated in the page:
    <tr>
    <td class="pwc_ReportHeader">
    <tr>
    <td colspan="7" align="right" >
    <table summary="">
    <tr>
    <td class="pagination"></td>
    <td class="pagination"></td>
    <td nowrap="nowrap" class="pagination"><span>1 - 2</span></td>
    <td class="pagination"></td>
    <td class="pagination"></td>
    </tr>
    </table>
    </td>
    </tr>
    </td>
    </tr>
    As you can see, it replaced the #PAGINATION# placeholder with a table inside a tr, which completely messes up the layout I want.
    Join the club:

    {thread:id=333925}
    {thread:id=1047198}

    (I'm sure there are others.)
    Where did those tr and table come from?
    From the innards of APEX.
    Is it possible to change what is generated?
    Maybe. Never done this, nor seen it done:

    {thread:id=1025125}

    Another approach would be to use a Dynamic Action/JavaScript to modify the APEX-generated elements in the DOM.
    These tags don't even have IDs or classes associated to them so it is impossible to style them using CSS.
    IDs and classes are not the only CSS selectors. Unless you're stuck in quirks mode on IE6/7/8/(9?), you can use attribute, child, adjacent sibling and pseudo-class selectors to target those elements.

    If you post the complete report template we can try to identify possible selectors.
  • 2. Re: #PAGINATION# in the report template
    Luis Cabral Pro
    Currently Being Moderated
    Thanks Paul,

    That is what I thought... Unfortunately I am stuck with IE 6 so those new fancy selectors are not an option.

    The only option I see, as you suggested, is to use JQuery to manipulate the DOM and assign the required classes to the tr that is added by the framework.

    I am very reluctant to use this solution though, it looks very messy to me to use javascript for something that seems so simple to be done using just CSS (after all it is 2011.) In my opinion, tables inside tables should not be used for something so simple as pagination links...

    Cheers,
    Luis

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points