Answers

• allan Posts: 63,530Questions: 1Answers: 10,474 Site admin

  April 4

  Hi,

  Good point thank you. The paging plugins have changed a bit in v2 and it looks like there is a little documentation to update.

  The easiest way to hide the ellipsis in v2 is to use a little CSS rather than a custom plugin. The element gets an ellipsis class.

  div.dt-paging .ellipsis {
   display: no e;
  }
  

  I think should do it. Apologies, I'm on a mobile atm so can't resist check it.

  Allan
• SLorenz Posts: 5Questions: 1Answers: 0

  April 5

  Hi Allan,

  thank you for your reply. You are right, I could remove the ellipsis with CSS. However, that's not enought for my use case since I try to remove the numbers of the first and last page, too.

  This is my pager using Datatables 1:
  

  By removing only the ellipsis I get something like this:
  

  It seems that with DataTables 2 I cannot control how the "numbers" element of the pager is rendered, since it's done by the internal function _pagingNumbers which I cannot override: https://github.com/DataTables/DataTablesSrc/blob/26a9c2f7f10d1b0f41009a6476b9784674c4767b/js/features/features.page.js#L46

  That's the only place in code where the parameters page and pages are defined.
• allan Posts: 63,530Questions: 1Answers: 10,474 Site admin

  April 5

  I'll have a bit of a play with it - it might be possible to use CSS to hide the first and last numbers as well. I'll let you know once I've tried it.

  Allan
• SLorenz Posts: 5Questions: 1Answers: 0

  April 5

  Thank you for your efforts. I really appreciate it!
• allan Posts: 63,530Questions: 1Answers: 10,474 Site admin

  April 6

  It isn't quite right, and the CSS is rather nasty, but this is the closest I was able to get it with just plain CSS: https://live.datatables.net/lehoxeli/1/edit .

  It almost works, but it doesn't add in buttons to replace those which have been hidden.

  The best way to handle this might be to modify the DataTables paging button generator to have an option not to do the first / last / ellipsis.

  At the moment the paging button layouts are defined by this part of the code - we could introduce a new numbers_middle token (or something like that).

  That then ends up here, via this call.

  I'll have a further think about how small a code addition I can make it do that in.

  Allan
• SLorenz Posts: 5Questions: 1Answers: 0

  April 8

  Thank you for your effort. I would really appreciate it if you could make this possible natively.

  Unfortunately, the CSS :has selector is not supported in Firefox ESR. So I cannot use your CSS solution (yet). But thank you anyway.

  Let me know if I can do something to help you implement this.
• allan Posts: 63,530Questions: 1Answers: 10,474 Site admin

  April 16

  I committed a new feature to DataTables to add the ability to have it hide the first and last numbers - while I was working on it I realised how redundant those numbers are now that I've got it displaying the first last icons buttons by default, so I rather like this feature

  It is in DataTables 2.0.4 (release notes) and can be enabled like this:

  var table = new DataTable('#example', {
    layout: {
      bottomEnd: {
        paging: {
          boundaryNumbers: false
        }
      }
    }
  });
  

  Live example.

  I hope this suits your needs.

  Allan
• SLorenz Posts: 5Questions: 1Answers: 0

  April 19

  That's awesome, thank you!

  It is still not 100% compatible with the implementation of DataTables 1.x but I could work around this by implementing a custom renderer.

  Btw: Doing so I discovered that your latest changes are not represented in your TypeScript type declarations: https://github.com/DataTables/Dist-DataTables/blob/ac26a0f8ec2badb23ee24a4442032292dae033be/types/types.d.ts#L164
  The key "numbers" should be renamed to "buttons" and "boundaryNumbers" is missing at all.

  I also discovered that according to your documentaion the layout option allows null values to remove a feature from the layout: https://datatables.net/reference/option/layout
  This is also not allowed by your Typescript declaration: https://github.com/DataTables/Dist-DataTables/blob/ac26a0f8ec2badb23ee24a4442032292dae033be/types/types.d.ts#L185
  I worked around this by defining an empty object.
• allan Posts: 63,530Questions: 1Answers: 10,474 Site admin

  April 19

  Thanks for pointing out those errors.

  The first one I've just fixed here and funnily enough, the other was fixed earlier due to another report on that error.

  Allan