JSLINK to remove rows from list view webpart

Question

I'm trying to remove rows from a list view webpart using JSLINK, I used the code from this link Remove rows from list view webpart, I'm able to remove the rows as expected but this is affecting the paging in that webpart, I noticed the paging count is not updated correctly. i.e. I have 7 items left and a page count of 30 - but the paging is displayed with 1-6 and 31-7. how to fix this.?

Added to that, the list view webpart headers renders the removed row items text for filtering, how to remove the items from header ?

Answer 1

You can't.

The ListViewWebPart does loading and paging on the server-side. If you now remove the rows using JSLink they'll be simply "hidden" (kind of) on the client side. The ListViewWebPart knows nothing of what you did and "thinks" the rows were all rendered.

Answer 2

As the @Nils answered, you can't. The list view web part get data from Server and JSLink a technique to render the data. JSLink itself doesn't process any of the data. It renders the data the way you want.

As a workaround, I would like to suggest you to create a new view, place the conditions you want to check as view filter and use this view in List View Web Part and apply the CSR/JSLink. This way your paging wont break.