How to align money in DataTable column

UI Components for React
Post Reply
tristram
Posts: 2
Joined: 22 Dec 2021, 16:35

27 Dec 2021, 13:06

I have to present a set of transactions in a table with columns for the usual stuff like date, payee,..., and amount. I have no problem with column alignment other than with the amount, which has to align on the decimal point (all amounts are fixed two decimal places). The templating example uses a template to format currency and seems to be right aligned. However that is not the case when I use it as the width of the numbers can range from 1000000.99 to 0.01 and may include a sign. When displayed in line with the templating example the numbers appear to be left aligned.

I tried wrapping them up in span of fixed width and right aligning, This seems to sort of work on wide displays but causes mayhem to all the column widths when overall width is restricted (like on a phone), making the table an eye sore. I've tried other crazy ways to achieve it and got nowhere!

Is there a way to tell DataTable that a column should be right aligned? If not, does anyone have an example of how to do it please?

tristram
Posts: 2
Joined: 22 Dec 2021, 16:35

29 Dec 2021, 23:36

I eventually discovered that the Column prop dataType does something along the lines that I need. However the documented use is the precise "Depending on the dataType of the column, suitable match modes are displayed." :)

Melloware
Posts: 3716
Joined: 22 Apr 2013, 15:48

31 Dec 2021, 18:24

Did you get it resolved because you can also right align columns with a simple style class.
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 6 guests