How can use custom currency in a input field?

I’m using LWC, but I can’t set custom currency in the lightning-input, using type number or currency.

I also try to use lightning-input-field of type currency, but I found in documentation:

Displays an input field for entering monetary data. The user’s
Salesforce locale determines the currency symbol and separator
characters used to format the number. Specifying a different locale is
currently not supported for currency.

We have users with, for example, local with USD but they can create Quotes in different currencies.

We need code something like that:

    <lightning-input type="number"
                 label="Price"
                 value="12345"
                 formatter="currency"
                 currencyIsoCode="EUR">
    </lightning-input>

Last line: currencyIsoCode="EUR" it’s what I need to set.

Thank you.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Unfortunately, the same problem exists in aura, but the workaround is to use ui:inputcurrency . LWC does not have ui-inputcurrency equivalent yet and thus you have to build it yourself.

You can use SLDS classes to give lightning look, you can refer my sample:

<template>

<div class="slds-form-element">
  <label class="slds-form-element__label" for="text-input-id-1" id="fixed-text-label">Price</label>
  <div class="slds-form-element__control slds-input-has-fixed-addon">
    <span class="slds-form-element__addon" id="fixed-text-addon-pre">£</span>
    <input type="number" id="text-input-id-1" placeholder="2000" aria-labelledby="fixed-text-label fixed-text-addon-pre fixed-text-addon-post" class="slds-input" />
    <span class="slds-form-element__addon" id="fixed-text-addon-post">euro</span>
  </div>
</div>
</template>

Playground Link : https://developer.salesforce.com/docs/component-library/tools/playground/jee6KjW0-/1/edit

Method 2

Lightning-input now supports FORMATTER attribute to allow CURRENCY and others like (decimal, percent, percent-fixed)

https://developer.salesforce.com/docs/component-library/bundle/lightning-input/specification


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x