CODEWITHSUNDEEP
vue.jsvuetify.js
Otorrinolaringologista -man
Otorrinolaringologista -man

Reputation: 1137

How do i reset v-money form fields

In my vuetify v-form i have fields to insert monetary values in which i use v-money to mask the values inserted, however when i try to reset the form, using either ".reset()" or by setting the values at the end of my function, the values are not reset.

What others way can i tr to reset the these fields?

The code is as follows

<v-col cols="6">
    <v-text-field
        v-model="value1" 
        v-money="money"
        refs='value1'
        :rules="baseRules"
        label="gross value"
    ></v-text-field>
</v-col>
<v-col cols="6" v-if='reset'>
    <v-text-field
        v-model="value2" 
        v-money="money"
        :rules="baseRules"
        label="net value"
    ></v-text-field>
</v-col>

data: () => ({
    valid: true,
    value1: '',
    value2: '',
    money: {
        decimal: ',',
        thousands: '.',
        prefix: '$ ',
        precision: 2,
        masked: false
    },
}),
methods: {
    reset () {
      this.$refs.myFormRef.reset()
      this.value1 = ''
      this.value2 = 0
    },

i also tried the following code but it didnt work. https://codepen.io/mukatk/pen/NYZvPW

Upvotes: 0

Views: 1676

Answers (1)

Renaud
Renaud

Reputation: 1300

v-money directive is not compatible with Vuetify's input I fear.

And it's worse than the reset issue. If you check your value you'll see it's actually the masked string (like "$ 123.456,01") instead of the number (123456.01).

Upvotes: 1

Related Questions