How to remove zeros after a comma or dot from price (currency)

user_8584078 0
Viewed 1047

Am trying to remove trailing zeros after , or . in a currency, still retaining the currency sign. For example, €90.00 to €90, 90.00€ to 90€ and €90.33 to €90.33.

The example can be found below:

$('.product-price-wrapp').each(function() { 
    var productPrice = $(this).find('.price').text();
    var trimPrice = productPrice.substr(0,productPrice.indexOf(',')); 
  productPrice.text(trimPrice);
});
body {
  padding: 20px;
  background: #20262E;
  font-family: Helvetica;
}

.price {
  color: green;
}

.price span {
  color: #747474;
} 

.price:first-child,
.price:last-child,
.price:nth-of-type(6){
  color: red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>

<div class="product-price-wrapp">
  <div class="price"><span>Product Price</span> 90,00 €</div>
  <br>
  <div class="price"><span>Product Price</span> 90,30 €</div>
  <br>
  <div class="price"><span>Product Price</span> 90,45 €</div>
  <br>
  <div class="price"><span>Product Price</span> 92,67 €</div>
  <br>
  <div class="price"><span>Product Price</span> 33.33 €</div>
  <br>
  <div class="price"><span>Product Price</span> £22.00</div>
  <br>
  <div class="price"><span>Product Price</span> £72,22</div>
  <br>
  <div class="price"><span>Product Price</span> £72,00</div>
</div>

WORKING VERSION: JSFiddle

You are all amazing, thanks a lot to you all for your help! Credit: @Cocest @A. Ramos @Ivan

css html jquery
3 Answers

You can use a regular expression in order to detect if the price contains a trailing comma: either ,00 or .00, if so you can replace it with an empty string.

I have used this regular expression:

/[\.,]0{2}/

  • [\.,] searches for either . or ,

  • 0{2} followed by two zeros

Here's the full code.

$('.product-price-wrapp > .price').each(function(index, element) {
  
  var priceElement = $(element);
  
  priceElement.text(
    'Product Price ' + priceElement.text().substring(14).replace(/[\.,]0{2}/, '')
  );
  
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>

<div class="product-price-wrapp">
  <div class="price"><span>Product Price</span> 90,00 €</div>
  <br>
  <div class="price"><span>Product Price</span> 90,30 €</div>
  <br>
  <div class="price"><span>Product Price</span> 90,45 €</div>
  <br>
  <div class="price"><span>Product Price</span> 92,67 €</div>
  <br>
  <div class="price"><span>Product Price</span> 33.33 €</div>
  <br>
  <div class="price"><span>Product Price</span> £22.00</div>
  <br>
  <div class="price"><span>Product Price</span> £72,22</div>
  <br>
  <div class="price"><span>Product Price</span> £72,00</div>
</div>

user_63313690

Try this solution. It's more flexible, it works for any price.

var c = '90,00 €'; //assign currency (value)

c = /[.,]0*[1-9]+/.test(c) ? c : c.replace(/[.,]0+/, '');

// use the currency here
user_17075920

you need to add another container for the price per se if you need to retain the color of the text because you're trying to change the text content of the ".price"

your code will look like this:

<div class="product-price-wrapp">
  <div class="price"><span>Product Price</span> <span class="price_tag">90,00 €</span></div>
  ...
</div>

then use the regex pattern /(\d+)([.,]0+)/ to remove the zeroes.

$('.product-price-wrapp .price .price_tag').each(function(){
   var price = $(this).text();
   price = price.replace(/(\d+)([.,]0+)/, "$1");
   $(this).text(price);
});

for the regex pattern, it has two capturing groups.

$1 = (\d+) : gets all one number or more.
$2 = ([.,]0+) : gets all the trailing zero with dot or comma on its first character.

so, when we used it on the code, we are all replacing the content that matches the pattern [number (1 or more)][comma or dot followed by trailing zeroes], then retain only the first capturing group which is the number (one or more).

user_109049250
Related