Remove "results per page" on a table

What’s the recommended way to display this table without the “show 10 results per page, showing rows 1-3 of 3”? For this table we don’t need it.

put a sticky note over it.

Sorry. In a sour mood. You could get rid of the drop down portion by setting the table component to show all records.

The Showing Rows bit would have to be removed w/ javascript. Not sure how though. Irvin or Menachem proabably know how.

Actually removing the whole line at the bottom is possible with a bit of targeted CSS.   Here is how. 

1.  Add a class to the table.   



Note: This is superbank release.  Your arrangement of table properties may be different. 

2. Add a CSS resource with this code. 

/* hide footer in table */<br>.hidetablefooter .nx-list-footer { <br>&nbsp; &nbsp; display:none;<br>}


The components of the table footer each are in thier own div,  which you could target instead of hiding the whole .nx-list-footer element. 

There you go… 


YES!! Thank you Rob!

Rob, how would you just get rid of the ‘Show 10 Per Page’ part? Our object names are ugly, and this case is going in a customer facing community. I want to keep the ‘Showing Rows 1-1 of 1’ part.

Real need is to hide the object name, or say something more customer friendly. Possible?

I second this. :slight_smile:

I simply want to replace the object name with “Rows” in every case. We can fudge that with JQuery, but it’d be nicer not to have to.

Qite simple to do so.
On the table go Display/Advanced CSS Class and assign a CSS having this content:

&#46;hidetablefooter &#46;nx-list-footer<b>-left</b> { display:none; }

Here is a sample page:













































.hidetablefooter .nx-list-footer-left {
display:none;
}





Hope this helps

Thanks, that was perfect!

More please…?

The display reads something like:

Show [10 v] Per Page (Load More) Showing Rows 1-4 of 4 First Previous 1 2 Next Last

Using the technique above, you can hide the entire display using .nx-list-footer.

With .nx-list-footer-left, everything from Show through More) is hidden.
With .nx-list-footer-center, Showing Rows 1-4 of 4 is hidden.
With .nx-list-footer-right, the First…Last paging controls are hidden.

Another thread indicated that .nx.list.loadmore will hide the (Load More) button.

Are there any other elements to the table footer? Is there a way to change the object name display other than changing the Label in the Sobject definition? A generic “Rows” would work, as would hiding the ' Per Page> element.

Found my own method in an onPageLoad javascript that builds a generic object History table:

skuid.model.getModel(‘History’).labelPlural = pHOBJECT+’ History Rows’;

This modifies the “ Per Page” text in the table footer.

Hello, I noticed in tables that have more than 50 records, the Load More function doesn’t show up. I even changed the pagination to Show All rows. As you can see in the footer, I’m only showin 1-50 but no option to view more.

Any ideas on how I can view all records on the table using the CSS provided:

.hidetablefooter .nx-list-footer **-left**  {

 display:none; }

Hello Roger

I think you misunderstood the purpose of the css provided. The only thing this piece of css does is hiding the “Load more rows” button for a table. It doesn’t change the tables behaviour in any way. If you use the show all property like you did, all rows contained in the model will show up in a page. If you don’t see all the data needed, you probably don’t load all the rows into the models in the first place.