More efficient way to format currency values

Question

I would like to display decimal numbers as USD currency within HTML pages. For example, display 1209.27 as $1,209 ²⁷.

Instead of using [DataType(DataType.Currency)] in the models, I format each number directly in the view:

@Html.Raw(Regex.Replace(Regex.Replace(String.Format("{0:C}", Model.Price), "(?<=\\.)([^.]*$)", "<sup>&nbsp;$1</sup>"), "\\.<sup>", "<sup>"))

Is there a more efficient way to achieve this format instead of repeating this all over?

I'd consider a CSS solution https://stackoverflow.com/questions/9372624/formatting-a-number-as-currency-using-css — Jasen, Jan 30 '19 at 18:43
Nice CSS/JS alternative. To minimize JS, I opted for a custom `HtmlHelper`. — Alfred Wallace, Jan 30 '19 at 19:20

score 5 · Accepted Answer · answered Jan 30 '19 at 18:38

5

You could consider writing a Razor DisplayTemplate or a custom html helper

answered Jan 30 '19 at 18:38

Joe

122,218
32
205
338

score 0 · Answer 2 · answered Jan 30 '19 at 19:21

Use CSS to style as you wish.

<style type="text/css">
.price { font-weight: bold;}
.currency {}
.decimals { font-size: 0.6em; font-weight: normal; vertical-align: baseline; top: -0.4em; position: relative; }
</style>
This item costs 
<span class="price">
<span class="currency">$</span>5,310<span class="decimals">.79</span></span> Dollars.

working fiddle here: https://jsfiddle.net/a3vksgcu/1/

Original solution here: https://css-tricks.com/forums/topic/solved-a-more-interesting-price-display-using-css/

More efficient way to format currency values

2 Answers2