Formatting Xano/Rest currency fields

[Aloy]

Newbie here. I have figured out how to connect my Xano data base to a weweb collection. In it I have a field called cost, which is stored as a decimal. I have successfully linked it to a text field but I cannot for the life of me figure out how to now format it as $currency. How do you do this?

[kevinwasie]

Welcome.

What currency do you want to format it as?

I live in USA. So, I created a custom function to convert an integer.

Here is how you can do it:

1. Click on the data tab in the tool bar

2. Click on +Add Formula

3. name the formula. I used toCurrency

4. add 1 parameter, name it whatever you want (I used “item”), and select number from the drop down.

5. in the function box, you will want to use something like below. The below code is JS that will take the incoming parameter, and apply the toLocaleString() Js function to it and return that.

return "$" + item.toLocaleString("en-US", {
    style: 'currency',
    currency: 'USD'
});

There are all types of different options in the toLocaleString, so google that and you’ll find your country.

Once you have that done, now you can use the function anywhere in your site.

Go to the text that you currently have bound to your database. Click on the functions area (see image below), scroll down, and click on Custom.

This will show your custom function.

Use that, and put your decimal database value into there. It will return your currency.

[Aloy]

OK…I think I get it, though I thought the whole point of this was nocode…
But when I try it I get an error.
Here’s my formula entry which seemed to go well:

Appreciate your help!

[Aloy]

And here is my attempt at using it, which is returning an “unexpected identifier”

[kevinwasie]

Hmm. That looks good. Can you take out the item[‘data’][‘cpu’] and just put in a number.

try toCurrency(25)

Does that work?

Also, you won’t need the “$” +, since that will come through the toLocaleString function.

[Aloy]

OK, gave that a try. Changed it to:
toCurrency(25) and I still get “Unexpected identifier”

[Aloy]

@kevinwasie

Also, you won’t need the “$” +, since that will come through the toLocaleString function.

Also, I don’t know what that means. I’m guessing you are suggesting dropping the “$” + from the formula definition. which I will try.

[kevinwasie]

Ah! I see it! You need a comma after currency:‘USD’

It should be currency: ‘USD’,

[Aloy]

Kevin, THANK YOU! that fixed it.

[Joyce]

Nicely done! Well done to both of you

@Aloy

though I thought the whole point of this was nocode…

You could probably put something similar with the existing math and slice no-code formulas but @kevinwasie’s solution is more elegant.

I’ve added “no-code currency styling formulas” to our list of product improvement requests so it’s more straightforward in the future

[Aloy]

Thanks Joyce!
I’ve been watching all of your videos. They are incredibly helpful. Thank you so much. I’m a bubbler and the transition was a bit rough at first, but I think I’m starting to get the hang of it as I slowly rebuild a former bubble app on weweb/Xano. Front end design is so much easier as is some of the logic of state/variable management. Though database integration is still a learning curve for me.

One ask for a video or tutorial…
A commonly used feature in bubble for me is the checkbox called “Enable auto-binding on parent element’s thing”. When checked for an element (say a text box in a repeating group), the controls allow the user to edit the field and on update, reflect the change results back into the data of the “Thing”. I use this when I don’t want the properly permissioned user to have to open a separate form or pop-up simply to edit and submit a record. To mimic this functionality in WeWeb I assume I need to use a form control (say short text), populate it’s initial value with the current database value, then create a workflow action for the field that if updated, on change, posts the revision back to Xano using a POST Api. Yet for the life of me I haven’t been able to figure out how to do it, so I’m guessing I might be setting up the POST wrong.

Is there a tutorial that might help me understand how to replicate this, ‘auto-binding’ functionality?
Al

[Joyce]

Hi @Aloy

Thank you for the kind words, really appreciate it!

Here’s a tutorial on how to pre-fill a form with the current database value. The tutorial is with Airtable but the logic is the same for Xano except, as you mention, you’ll have to create your own POST request.

Can you maybe create a new topic in the community and share a loom showing how things are currently setup in Xano and WeWeb, what you’re trying to do, and what error message you get from Xano when you test the action?

(a separate topic would be great because it helps others search for answers)

[sebaspindu]

Can you please share an example of how to do it the no code way, also if there is a way to format for %