# Adding comma to price

**URL:** <https://forum.wixstudio.com/t/adding-comma-to-price/2784>\
**Category:** Ask the community\
**Tags:** code, question\
**Created:** [August 10, 2018, 12:46am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784 "2018-08-10T00:46:35Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![motherbee](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/motherbee/32/5580_2.png) [@motherbee](https://forum.wixstudio.com/u/motherbee)\
**Post date:** [August 10, 2018, 12:46am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/1 "2018-08-10T00:46:35Z")

</div>

Good day Coders,

I was able to calculate the total price in the shopping cart area, it calculates properly except the comma i added as separator does not seem to work. I also wanted to put a peso currency on the Price but I can’t figure it out. The one you’re seeing is just a text fixed there written as ₱. can you please check my code?

I highly appreciate a lot if you somebody is kind enough to help.

 ![](https://us1.discourse-cdn.com/wix/original/3X/5/0/5030e0b0785887a3641e9122f299c33bbe5deb7a.png)

 ![](https://us1.discourse-cdn.com/wix/original/3X/7/5/7543ba04ceadda1d80750691e31843e41b1fe7b6.png)

---

<div class="post-metadata">

**Author:** ![tiaan](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tiaan/32/896_2.png) [@tiaan](https://forum.wixstudio.com/u/tiaan)\
**Post date:** [August 10, 2018, 7:37am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/2 "2018-08-10T07:37:16Z")

</div>

Hi Analiza

Try using ‘toLocalString()’ - this should help you with the commas.

Best of luck!  
Tiaan

---

<div class="post-metadata">

**Author:** ![charles27607](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/charles27607/32/9975_2.png) [@charles27607](https://forum.wixstudio.com/u/charles27607)\
**Post date:** [March 13, 2019, 3:04am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/3 "2019-03-13T03:04:32Z")

</div>

I’m having trouble getting this to work. Would you mind showing me some example code of how this is supposed to work to get 40000 to look like $40,000?

---

<div class="post-metadata">

**Author:** ![tiaan](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tiaan/32/896_2.png) [@tiaan](https://forum.wixstudio.com/u/tiaan)\
**Post date:** [March 13, 2019, 4:57am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/4 "2019-03-13T04:57:24Z")

</div>

@charles27607

Something like this if value came from input1 & input1 input type is set to number. Otherwise you’d need to parseFloat the value to convert it to a number.

```javascript
let price = "$" + $w("#input1").value.toLocalString()

```

Hope this helps!  
Tiaan

---

<div class="post-metadata">

**Author:** ![charles27607](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/charles27607/32/9975_2.png) [@charles27607](https://forum.wixstudio.com/u/charles27607)\
**Post date:** [March 13, 2019, 5:20am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/5 "2019-03-13T05:20:10Z")

</div>

Thanks, Tiaan. That worked!! Now, to have it show up inside a repeater… The value is coming from a database as a number. Would this still work or would I have to create some sort of foreach thing?

---

<div class="post-metadata">

**Author:** ![tiaan](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tiaan/32/896_2.png) [@tiaan](https://forum.wixstudio.com/u/tiaan)\
**Post date:** [March 13, 2019, 6:01am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/6 "2019-03-13T06:01:26Z")

</div>

@charles27607 you would need to create foreach() function and run that when the dataset has finished loading

---

<div class="post-metadata">

**Author:** ![charles27607](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/charles27607/32/9975_2.png) [@charles27607](https://forum.wixstudio.com/u/charles27607)\
**Post date:** [March 13, 2019, 11:26pm UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/7 "2019-03-13T23:26:34Z")

</div>

@tiaan … I’m trying to use the foreach function, but I don’t think I’m doing it correctly. Would you mind looking at my code and sending something that would work?

$w.onReady( **function** () {  
$w(“#dynamicDataset”).onReady(() =\> {  
populateCalculatedFields();  
} );

$w(“#dynamicDataset”).onCurrentIndexChanged( (index) =\> {  
populateCalculatedFields();  
} );  
} );

**function** populateCalculatedFields() {  
**const** currentItem = $w(“#dynamicDataset”).getCurrentItem();  
$w(“#repeater1”).forEachItem( ($item, itemData, index) =\> {  
console.log($w(“#priceText”).text);  
**var** number = Number($w(“#priceText”).text);  
console.log(number.toLocaleString());  
$w(“#priceText”).text = “$” + number.toLocaleString();  
});  
}

---

<div class="post-metadata">

**Author:** ![tiaan](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tiaan/32/896_2.png) [@tiaan](https://forum.wixstudio.com/u/tiaan)\
**Post date:** [March 14, 2019, 6:55am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/8 "2019-03-14T06:55:26Z")

</div>

@info98862

in your forEach function, try replacing $w if front of the elements with $item - that should get you going in the right direction 🙂

---

<div class="post-metadata">

**Author:** ![charles27607](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/charles27607/32/9975_2.png) [@charles27607](https://forum.wixstudio.com/u/charles27607)\
**Post date:** [August 19, 2019, 9:24pm UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/9 "2019-08-19T21:24:16Z")

</div>

@tiaan , I was able to get the following code working… but it’s only on the first page of the repeater. Any idea how to get the prices formatted for the other pagination?

$w.onReady( **function** () {  
$w(“#dynamicDataset”).onReady(() =\> {  
populateCalculatedFields();  
} );

$w(“#dynamicDataset”).onCurrentIndexChanged( (index) =\> {  
populateCalculatedFields();  
} );  
} );

**function** populateCalculatedFields() {  
$w(“#dynamicDataset”).onReady(() =\> {  
$w(‘#repeater1’).forEachItem( ($item, itemData, index) =\> {  
**const** numberWithCommas = (x) =\> {  
**return** x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, “,”);  
}  
$item(‘#priceText’).text = “$” + numberWithCommas(parseInt($item(‘#priceText’).text, 10));  
} );  
});  
}

---

<div class="post-metadata">

**Author:** ![tiaan](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tiaan/32/896_2.png) [@tiaan](https://forum.wixstudio.com/u/tiaan)\
**Post date:** [August 20, 2019, 9:31am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/10 "2019-08-20T09:31:00Z")

</div>

@charles

I haven’t had the need to try, but if I had to take a wild guess I’d probably call these functions again whenever the pagination has been clicked. I suspect it might need to re-render the new data.

Keep us posted!

Tiaan

---

<div class="post-metadata">

**Author:** ![charles27607](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/charles27607/32/9975_2.png) [@charles27607](https://forum.wixstudio.com/u/charles27607)\
**Post date:** [August 20, 2019, 9:40am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/11 "2019-08-20T09:40:56Z")

</div>

@tiaan Thanks, Tiaan… here’s what I did to get it to work. It’s not perfect, but it works (kinda)…

$w.onReady( **function** () {  
$w(“#dynamicDataset”).onReady(() =\> {  
console.log(‘ready’)  
populateFormattedPrice();  
} );

$w(“#dynamicDataset”).onCurrentIndexChanged( (index) =\> {  
console.log(‘index has changed’)  
populateNewFormattedPrice();  
} );

} );

**function** populateFormattedPrice() {  
$w(“#dynamicDataset”).onReady(() =\> {  
$w(‘#repeater1’).onItemReady( ($item, itemData, index) =\> {  
**const** numberWithCommas = (x) =\> {  
**return** x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, “,”);  
}  
$item(‘#priceText’).text = “$” + numberWithCommas(parseInt($item(‘#priceText’).text, 10));  
} );  
});  
}

**function** populateNewFormattedPrice() {  
$w(“#dynamicDataset”).onReady(() =\> {  
$w(‘#repeater1’).forEachItem( ($newItem, itemData, index) =\> {  
console.log(‘new item ready’)  
**const** newNumberWithCommas = (x) =\> {  
**return** x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, “,”);  
}  
$newItem(‘#priceText’).text = “$” + newNumberWithCommas(parseInt($newItem(‘#priceText’).text, 10));  
});  
});  
}

---

<div class="post-metadata">

**Author:** ![bluetigon06](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/bluetigon06/32/29298_2.png) [@bluetigon06](https://forum.wixstudio.com/u/bluetigon06)\
**Post date:** [September 8, 2021, 10:51am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/12 "2021-09-08T10:51:16Z")

</div>

Hello guys, I’m new to coding. Especially Velo, but I’ve tried my best to understand it. I’ve tried all the tutorials here at the forum but I always get an error like “Property ‘value’ does not exist on text type.” In my Content Manager, I already changed the property type from text into number but still got an error. What have I done wrong? Please help.

---

<div class="post-metadata">

**Author:** ![mohamederwa-11](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/mohamederwa-11/32/30993_2.png) [@mohamederwa-11](https://forum.wixstudio.com/u/mohamederwa-11)\
**Post date:** [November 23, 2021, 6:25pm UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/13 "2021-11-23T18:25:33Z")

</div>

For anyone still having trouble using .toLocaleString() to display commas to a Number Field from a dataset in a repeater, here’s the code that I used which works perfectly for me:

$w . onReady ( **function** () {  
$w ( “#yourDataset” ). onReady (() =\> {  
$w ( “#yourRepeater” ). forEachItem (( $item , itemData , index ) =\> {  
**let** number = Number ( $item ( “#repeaterTextBox” ). text ). toLocaleString ();  
$item ( “#repeaterTextBoxID” ). text = number ;  
})  
})  
});

Plug in the ID’s for your page’s elements and this should display the number values in “#repeaterTextBox” with commas in them in preview/Live after the page loads.

If you also have dynamic pages for each of your dataset/repeater items, you can add this code in those pages as well:

$w . onReady ( **function** () {  
$w ( “#yourDataset” ). onReady (() =\> {  
**let** number = Number ( $w ( “#textBox” ). text ). toLocaleString ();  
$w ( “#textBox” ). text = number ;  
})  
});

Note: Remember that the element ID’s may be be different in this page so make sure you change them accordingly if that’s the case

---

<div class="post-metadata">

**Author:** ![krays23](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/krays23/32/10173_2.png) [@krays23](https://forum.wixstudio.com/u/krays23)\
**Post date:** [August 9, 2022, 11:01am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/14 "2022-08-09T11:01:24Z")

</div>

Searched for ages finally fixed mine to this

$w ( “#MaintPwcaltext” ). text = parseFloat ( Number ( ( rmrMale + tefMale + eee + neat ) \* daysinweek )). toLocaleString ( ‘en-US’ , { minimumFractionDigits : 0 , maximumFractionDigits : 0 });

---

<div class="post-metadata">

**Author:** ![chindianapolis](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/chindianapolis/32/35147_2.png) [@chindianapolis](https://forum.wixstudio.com/u/chindianapolis)\
**Post date:** [October 9, 2022, 4:11am UTC](https://forum.wixstudio.com/t/adding-comma-to-price/2784/15 "2022-10-09T04:11:45Z")

</div>

Thank you you are the live savior.