SOLVED

Sharepoint Online, number column NOT aligned right

%3CLINGO-SUB%20id%3D%22lingo-sub-1205173%22%20slang%3D%22en-US%22%3ESharepoint%20Online%2C%20number%20column%20NOT%20aligned%20right%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1205173%22%20slang%3D%22en-US%22%3E%3CP%3EHello%2C%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3Ei%20have%20a%20sharepoint%20online%20custom%20list%20with%20number%20column(s)%20with%20decimals%20and%20thousands%20separator.%20As%20far%20as%20I%20understand%2C%20numbers%20should%20be%20aligned%20right%20by%20default%3F%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EHowever%20in%20my%20case%20all%20numbers%20are%20aligned%20left%20which%20looks%20a%20bit%20odd%20(see%20screen%20shot).%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EWhat%20am%20I%20doing%20wrong%3F%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks%20for%20your%20help!%3C%2FP%3E%3CP%3ESinan%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22SPOleftalignednumber.png%22%20style%3D%22width%3A%20232px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F174629i6AB651A47949FE5E%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20title%3D%22SPOleftalignednumber.png%22%20alt%3D%22SPOleftalignednumber.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-1205173%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3ESharePoint%20Online%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1206094%22%20slang%3D%22en-US%22%3ERe%3A%20Sharepoint%20Online%2C%20number%20column%20NOT%20aligned%20right%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1206094%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F420284%22%20target%3D%22_blank%22%3E%40Sinan621%3C%2FA%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EHi%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EDefault%20Sharepoint%20aligns%20left!%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EIf%20you%20want%20to%20align%20the%20text%20to%20the%20right%2C%20you%20should%20copy%20the%20following%20code%20and%20paste%20it%20in%20the%3C%2FP%3E%3CP%3EJSON%20Formatting%20to%20Customize%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CDIV%20class%3D%22mceNonEditable%20lia-copypaste-placeholder%22%3E%26nbsp%3B%3C%2FDIV%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22formatting%20json.png%22%20style%3D%22width%3A%20447px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F174674i68AE64718F7484E0%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20title%3D%22formatting%20json.png%22%20alt%3D%22formatting%20json.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%7B%3CBR%20%2F%3E%22%24schema%22%3A%20%22%3CA%20href%3D%22https%3A%2F%2Fdeveloper.microsoft.com%2Fjson-schemas%2Fsp%2Fcolumn-formatting.schema.json%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fdeveloper.microsoft.com%2Fjson-schemas%2Fsp%2Fcolumn-formatting.schema.json%3C%2FA%3E%22%2C%3CBR%20%2F%3E%22elmType%22%3A%20%22div%22%2C%3CBR%20%2F%3E%22style%22%3A%20%7B%3CBR%20%2F%3E%22display%22%3A%20%22table%22%2C%3CBR%20%2F%3E%22width%22%3A%20%22100%25%22%3CBR%20%2F%3E%7D%2C%3CBR%20%2F%3E%22children%22%3A%20%5B%3CBR%20%2F%3E%7B%3CBR%20%2F%3E%22elmType%22%3A%20%22div%22%2C%3CBR%20%2F%3E%22txtContent%22%3A%20%22%40currentField%22%2C%3CBR%20%2F%3E%22style%22%3A%20%7B%3CBR%20%2F%3E%22display%22%3A%20%22table-cell%22%2C%3CBR%20%2F%3E%22text-align%22%3A%20%22right%22%2C%3CBR%20%2F%3E%22vertical-align%22%3A%20%22middle%22%3CBR%20%2F%3E%7D%3CBR%20%2F%3E%7D%3CBR%20%2F%3E%5D%3CBR%20%2F%3E%7D%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1206966%22%20slang%3D%22en-US%22%3ERe%3A%20Sharepoint%20Online%2C%20number%20column%20NOT%20aligned%20right%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1206966%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F563137%22%20target%3D%22_blank%22%3E%40FabioO365GoD%3C%2FA%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EMany%20thanks%20for%20your%20quick%20reply!%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20copy%2Fpasted%20your%20solution.%20Result%20is%20that%20the%20numbers%20are%20now%20aligned%20right%20but%20I%20lost%20the%20thousand%20separator%20and%20decimals%20with%20zeros%20(not%20showing).%20See%20screen%20shot%20below.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EBasically%20it%20looks%20like%20numbers%20are%20converted%20into%20text%3F%20Is%20there%20a%20solution%20to%20align%20right%20AND%20keep%20the%20number%20formatting%20including%20thousand%20separator%20and%20number%20decimals%20for%20all%20rows%3F%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20feel%20like%20we%20are%20almost%20there...%20%3A)%3C%2Fimg%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ECheers%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22Sinan621_1-1583252752143.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F174719i6CB3E079E8A241C9%2Fimage-size%2Fmedium%3Fv%3D1.0%26amp%3Bpx%3D400%22%20title%3D%22Sinan621_1-1583252752143.png%22%20alt%3D%22Sinan621_1-1583252752143.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1208415%22%20slang%3D%22en-US%22%3ERe%3A%20Sharepoint%20Online%2C%20number%20column%20NOT%20aligned%20right%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1208415%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F420284%22%20target%3D%22_blank%22%3E%40Sinan621%3C%2FA%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI'm%20sorry%20but%20it%20takes%20more%20steps!%3C%2FP%3E%3CP%3ESharepoint%20doesn't%20have%20the%20possibility%20to%20set%20decimal%20numbers.%3C%2FP%3E%3CP%3EAs%20first%20thing%20to%20do%20you%20need%20to%20create%20a%20column%2C%20computed%20with%20the%20following%20formula%3A%3C%2FP%3E%3CP%3E%3CSTRONG%3E%3DTEXT(%5Bcolumn%5D%2C%22.00%22)%3C%2FSTRONG%3E%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-center%22%20image-alt%3D%222020-03-04%2010_07_56-Create%20Column.png%22%20style%3D%22width%3A%20653px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F174998i0D17532CFC1617BF%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20title%3D%222020-03-04%2010_07_56-Create%20Column.png%22%20alt%3D%222020-03-04%2010_07_56-Create%20Column.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThen%20insert%20the%20following%20code%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%3E%7B%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22%24schema%22%3A%20%22%3C%2FSPAN%3E%3CA%20href%3D%22https%3A%2F%2Fdeveloper.microsoft.com%2Fjson-schemas%2Fsp%2Fcolumn-formatting.schema.json%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fdeveloper.microsoft.com%2Fjson-schemas%2Fsp%2Fcolumn-formatting.schema.json%3C%2FA%3E%3CSPAN%3E%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22elmType%22%3A%20%22div%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22style%22%3A%20%7B%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22display%22%3A%20%22table%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22width%22%3A%20%22100%25%22%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%7D%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22children%22%3A%20%5B%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%7B%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22elmType%22%3A%20%22div%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22txtContent%22%3A%20%22%40currentField%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22style%22%3A%20%7B%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22display%22%3A%20%22table-cell%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22text-align%22%3A%20%22right%22%2C%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%22vertical-align%22%3A%20%22middle%22%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%7D%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%7D%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%5D%3C%2FSPAN%3E%3CBR%20%2F%3E%3CSPAN%3E%7D%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%3EThanks%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
Occasional Contributor

Hello, 

 

i have a sharepoint online custom list with number column(s) with decimals and thousands separator. As far as I understand, numbers should be aligned right by default?

 

However in my case all numbers are aligned left which looks a bit odd (see screen shot).

 

What am I doing wrong?

 

Thanks for your help!

Sinan

SPOleftalignednumber.png

9 Replies
Highlighted

@Sinan621 

 

Hi

 

Default Sharepoint aligns left!

 

If you want to align the text to the right, you should copy the following code and paste it in the

JSON Formatting to Customize

 

 

formatting json.png

{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "div",
"style": {
"display": "table",
"width": "100%"
},
"children": [
{
"elmType": "div",
"txtContent": "@currentField",
"style": {
"display": "table-cell",
"text-align": "right",
"vertical-align": "middle"
}
}
]
}

 

Thanks

Highlighted

@FabioO365GoD 

 

Many thanks for your quick reply!

 

I copy/pasted your solution. Result is that the numbers are now aligned right but I lost the thousand separator and decimals with zeros (not showing). See screen shot below.

 

Basically it looks like numbers are converted into text? Is there a solution to align right AND keep the number formatting including thousand separator and number decimals for all rows?

 

I feel like we are almost there... :)

 

Cheers

 

Sinan621_1-1583252752143.png

 

 

Highlighted

@Sinan621 

 

I'm sorry but it takes more steps!

Sharepoint doesn't have the possibility to set decimal numbers.

As first thing to do you need to create a column, computed with the following formula:

=TEXT([column],".00")

2020-03-04 10_07_56-Create Column.png

 

Then insert the following code

 

{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "div",
"style": {
"display": "table",
"width": "100%"
},
"children": [
{
"elmType": "div",
"txtContent": "@currentField",
"style": {
"display": "table-cell",
"text-align": "right",
"vertical-align": "middle"
}
}
]
}

 

Thanks

 

Highlighted

@FabioO365GoD 

 

Again, many thanks for taking time to help me with my question. I tried it and it is very close. The only missing part is now the thousand separator: Is that possible?

 

And will I be still able to make number calculations with this type of column?

 
 

Cheers

Sinan

 

 

 

Highlighted
Best Response confirmed by Sinan621 (Occasional Contributor)
Solution

@Sinan621 

 

Yes, you need to replace the formula:

=TEXT([Column],"###,###.00")

 

This type of modification doesn’t have any impact on the original column

 

Thanks

Highlighted

@FabioO365GoD 

 

You rock! It works, many many thanks :)

 

For the benefit of all, here comes a summary of the steps:

 

- create a new calculated column with this formula: =TEXT([Column],"###,###.00")

- format this new calculated column with:

{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "div",
"style": {
"display": "table",
"width": "100%"
},
"children": [
{
"elmType": "div",
"txtContent": "@currentField",
"style": {
"display": "table-cell",
"text-align": "right",
"vertical-align": "middle"
}
}
]
}

Sinan621_0-1583322037655.png

 

Highlighted

@Sinan621 

This is great information but does it mean that the user has to enter the value in one column and then we use this calculated column to present the data right aligned? 

So then the users would have to be aware of this if making any edits afterwards?

 

When I created a new column called "Amount" and entered the formula =TEXT([Amount],"###,###.00")

I get an error saying the column doesn't exist?

 

Thanks!

Highlighted

@markikav Hi, cannot help you with the error message, I am not technical expert. Your other question to make the user aware of the two columns: actually I use the the "second" column in a specific view or readers only so no issue there with having "duplicated" the columns.

Highlighted

@markikav 

Would you mind sending the screenshot showing the formula that you insert and the errors that you get?

 

Thanks