I'm writing a Lightning Component using the ui:inputnumber field. When I apply a format to the field and that format contains a % sign, the field displays with 2 extra zeroes. What am I doing wrong? Note: The data in the record being displayed has not changed between these examples.
1 Answer
Percentages are ratios of one thing to another thing. Technically, a percentage by itself is meaningless without context. For example, looking to Opportunities as a standard example, we have an Amount, a Probability, and an Expected Revenue field for reporting. Expected Revenue is a formula that essentially reads Amount times Probability.
Since we use percentages so often in Salesforce to derive one value from another (e.g. to calculate taxes, etc), percentages are automatically divided by 100 when being saved to the database, and multiplied by 100 when leaving the database (e.g. to the user interface). This happens for you automatically with no intervention.
This behavior allows you to do some pretty cool things, like writing this in Apex Code:
oppRecord.Taxed_Amount__c = oppRecord.Amount * oppRecord.Tax_Rate__c;
This also works in formulas, flows, and anywhere else a field is specifically created as a percentage.
Lightning also obeys these rules. The value, expressed as a percentage, will appear 100 times smaller in your code. Again, this lets you write things like:
var amount = component.get("v.amount"),
taxRate = component.get("v.taxrate"),
total = amount * taxRate;
If you want a percentage, you'll get a percentage. A percentage is 100 times larger than the decimal value it represents.
This not only means your code is simpler, but the user doesn't have to remember to type in 0.1 if they want 10%. The conversion happens automatically without the user having to think about it.
-
3Ok, I get that, but what's confusing me is the record UI vs the component UI.– Tom G.Oct 17, 2016 at 14:16
-
2The user entered '50' and the record display that as '50%'. It's '.5' behind the scenes and that's cool, but shouldn't the ui:inputnumber field automatically multiply it back up to '50' when it displays it?– Tom G.Oct 17, 2016 at 14:18