By default, the DataTable displays 2 paginators: one above and another one below the table. Looking up the YUI API documentation, I could see that I can pass an array of YUI containers as a config parameter but - what are the names of these containers?
I've tried loooking at the HTML of the page using Firebug. The ID of the divs containing the paginators are: yui-dt0-paginator0 (above) and yui-dt0-paginator1 (below). If I use them to configure the containers for the navigator, then the navigator is just not displayed at all. Here's the relevant extract of the GSP page containing the Datatable element.
Ok, I have it now. Posting it here in case someone bumps into the same question.
好的,我现在拥有它。如果有人碰到同样的问题,请在此处发布。
So what you have to do is create a 'container' (a DIV will do) by whatever id, and reference it into the containers configuration item. Example:
所以你要做的就是用任何id创建一个'容器'(DIV会做),并将它引用到容器配置项中。例:
This is the List of Control Accounts
${flash.message}
You just have to make sure that the class associated to the div is yui-pg-container. As an added bonus, the style on that div will align the paginator to the right.
This has the advantage that the paginator is aligned to the tables right border. If you want to have the pagination at the bottom of the table, just change yui-dt0-paginator1 to yui-dt0-paginator0.
I have many tens of YUI datatables and didn't want to have to write a selector for each one so here is what I did. Create a 'container' div around each datatable then use the first-child selector to set the visibility to hidden like so: