Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Placeholder option? #54

Open
mcrider opened this issue Apr 19, 2018 · 11 comments
Open

Placeholder option? #54

mcrider opened this issue Apr 19, 2018 · 11 comments

Comments

@mcrider
Copy link

mcrider commented Apr 19, 2018

Is it possible to use placeholder text instead inside the input of just displaying the default model value?

@DinsmoreDesign
Copy link

+1, would love to know this as well. I have a requirement from a client where they want to not show a default value - v-money will always force a value of 0. I don't want to mask unless the user has input something.

@matthew-socialcore
Copy link

+2000

@fergardi
Copy link

This will be interesting for me as well, +1.

@breaktag
Copy link

+1. I would love this option too. At the moment, showing 0.00 is confusing to my customers as they think the price is zero as opposed to been not set

@xerminada
Copy link

+1
would love too...

@yvdlima
Copy link

yvdlima commented Nov 20, 2018

You can show the input placeholder using the v-money directive instead of the component.

<input placeholder="00.00" v-model="price" v-money="price !== null ? money : null" class="form-input input-lg" />

Fiddle adapted from the read.me: https://jsfiddle.net/fnxub0yg/1/

@mrsweetie-k
Copy link

@yvdlima
Actually I want to get unmasked value. Then I cannot use the directive.
So I should use the component, but the component cannot accept null.

@yvdlima
Copy link

yvdlima commented Dec 4, 2018

@Kimyeongbin
As a workaround you could remove the mask manually:

<input v-money="money" @change="uglyWorkaround" model="maskedValue">

methods: {
  uglyWorkaround() {
    this.value = parseFloat(this.maskedValue.replace(".", "").replace(",", "."));
    // Do it where it makes sense for your case, not necessary on change event
  }
}

@mrsweetie-k
Copy link

@yvdlima
How about changing the value prop of the component to allow null ?
I don't know the side effect of it, but I simply think that's the best way without doing ugly things.

I find this fork. I'm using the allowBlank option and it can be solved.
nholden/v-money

#51
https://github.com/nholden/v-money

@evgeniyGusev
Copy link

You can show the input placeholder using the v-money directive instead of the component.

<input placeholder="00.00" v-model="price" v-money="price !== null ? money : null" class="form-input input-lg" />

Fiddle adapted from the read.me: https://jsfiddle.net/fnxub0yg/1/

Thanks! It's cool!

@jonathanpmartins
Copy link

hey,
Unfortunately I don't think support will come soon. This repo seems to be abandoned! I decided to upgrade this package to be used with Vue3.

Welcome v-money3!

I'm interested to maintain v-money3 for vue 3 and beyond. Feel free to open this same issue there if you are planning to upgrade your project.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

10 participants