Value from database not formatting correctly

[HenryP3]

Hello,

I'm facing an issue, that occurs when I retrieve a BigDecimal from my Oracle database, I have a value of 120.1 and when it's loaded to the input masked with money it loads 12,01 not considering the decimal separator. Is there any configuration that makes an autocomplete to work arround this case?

[inodaf]

@HenryP3, can you provide us a more verbose info? Something like a snippet of your code or a log?

[caioincau]

@HenryP3 AwesomeMask does not support the format 120.1, you will need to parse the value to 12010

[HenryP3]

<template>
<input  v-model="discount" type="text" v-mask="'money'"/>
</template>
<script>
  export default {
      data () {
         return {
             discount: null
         }
      }
</script>

My discount attribute is filled with the number 120.1 that is retrived from my database. The issue is that the mask ignores the decimal separator of a javascript number object, and sets the decimal separator after 2 digits from the right to the left, I think the right behavior would be check for the already existent decimal separator and complete with zeroes to the right. The database doesn't save the zero at the end of a decimal and I'd have to check the values from my backend to parse all of them before sending the response to my frontend.

[caioincau]

Yeah @HenryP3 but sadly, we only support Integer numbers, not Decimal, we will appreciate a pull request with this new feature.

This is not a bug or issue, is a feature that needs to be added.

[HenryP3]

Hi @caioincau how can I install and run the project to implement and test the support to decimal values?

[caioincau]

HI @HenryP3 the way I usually do is:

1) Clone/Fork the project 2) Apply changes 3) Run the command npm run build 4) Copy these files from root dir to my node_modules/awesome-mask in the project I use awesome-mask.

event-listener.js
index.js
is-character-keypress.js

Thanks!

[HenryP3]

Hi @caioincau, I've made a pull request, but closed it. I could make an existing value be formatted correctly but the input of a new value was bugged, I'm trying to figure how to fix it and then I'll do another pull request.

[caioincau]

Hi @HenryP3, I don't think this feature needs to be a breaking change from "money'" to an object, it should by default, check on bind if the number has a . and if it has, it should multiply the number per 100.

[caioincau]

Can you please try the version from this build in your application?

https://github.com/moip/awesome-mask/tree/dot_separator

[HenryP3]

@caioincau I just found out a way to make it work with no changes at all, at the method that loads the decimals I can use parseFloat and fixed from native javascript Number type, like the example, and the input will present it correctly

<template>
<input  v-model="discount" type="text" v-mask="'money'"/>
</template>
<script>
   export default {
      data () {
         return {
            discount: parseFloat(120.1).toFixed(2) // If I parse the value as a float,
                                                   // the input will present it correctly
         }
      }
   }
</script>