Hi,

thank u first, npm run build problem

ERROR in static/js/vendor.45cf410bef1d1ee48a7d.js from UglifyJs Unexpected character '`' [./~/vue-masked-input/src/MaskedInput.js:7,0][static/js/vendor.45cf410bef1d1ee48a7d.js:61918,12]

what is the problem ? how to fix ? Ie not working app

I downloaded your package in my laravel 5.3 + vuejs 2.1.3 npm install vue-masked-input --save

then in app.js import MaskedInput from 'vue-masked-input';

then in vue component I have field (I also have vee-validate)

<div class="form-group col-xs-12 col-sm-6" :class="{'has-error': errors.has('phone') }">
         <label>phone</label>
         <div class="input-group">
                 <span class="input-group-addon"><i class="fa fa-phone"></i></span>
                 <masked-input v-model="phone" mask="\+\7 (111) 111-11-11" placeholder="phone" name="phone"/>
         </div>
         <p class="text-danger" v-if="errors.has('phone')">{{ errors.first('phone') }}</p>
</div>

then I have errors when trying to compile all this in gulp.

> gulp
[19:50:45] Using gulpfile d:\OpenServer\domains\mysite.new\gulpfile.js
[19:50:45] Starting 'all'...
[19:50:45] Starting 'copy'...
[19:50:45] Finished 'copy' after 55 ms
[19:50:45] Starting 'copy'...
[19:50:45] Finished 'copy' after 9.93 ms
[19:50:45] Starting 'sass'...
[19:50:46] Finished 'sass' after 883 ms
[19:50:46] Starting 'styles'...
[19:50:46] Finished 'styles' after 52 ms
[19:50:46] Starting 'webpack'...
{ [Error: ./~/buble-loader!./~/vue-loader/lib/selector.js?type=script&index=0!./~/vue-masked-input/src/MaskedInput.vue
Module build failed: Error
    at ForOfStatement.initialise (d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:2004:65)
    at d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:9381:56
    at Array.forEach (native)
    at BlockStatement.initialise (d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:9381:15)
    at Node.initialise (d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:858:12)
    at d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:9381:56
    at Array.forEach (native)
    at BlockStatement.initialise (d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:9381:15)
    at FunctionExpression.initialise (d:\OpenServer\domains\mysite.new\node_modules\buble\dist\buble.umd.js:858:12)
 @ ./~/vue-masked-input/src/MaskedInput.vue 5:18-105
 @ ./resources/assets/js/frontend/app.js]
  message: './~/buble-loader!./~/vue-loader/lib/selector.js?type=script&index=0!./~/vue-masked-input/src/MaskedInput.vue\nModule build fai
led: Error\n    at ForOfStatement.initialise (d:\\OpenServer\\domains\\mysite.new\\node_modules\\buble\\dist\\buble.umd.js:2004:65)\n    a
t d:\\OpenServer\\domains\\mysite.new\\node_modules\\buble\\dist\\buble.umd.js:9381:56\n    at Array.forEach (native)\n    at BlockStateme
nt.initialise (d:\\OpenServer\\domains\\mysite.new\\node_modules\\buble\\dist\\buble.umd.js:9381:15)\n    at Node.initialise (d:\\OpenServ
er\\domains\\mysite.new\\node_modules\\buble\\dist\\buble.umd.js:858:12)\n    at d:\\OpenServer\\domains\\mysite.new\\node_modules\\buble\
\dist\\buble.umd.js:9381:56\n    at Array.forEach (native)\n    at BlockStatement.initialise (d:\\OpenServer\\domains\\mysite.new\\node_mo
dules\\buble\\dist\\buble.umd.js:9381:15)\n    at FunctionExpression.initialise (d:\\OpenServer\\domains\\mysite.new\\node_modules\\buble\
\dist\\buble.umd.js:858:12)\n @ ./~/vue-masked-input/src/MaskedInput.vue 5:18-105\n @ ./resources/assets/js/frontend/app.js',
  showStack: false,
  showProperties: true,
  plugin: 'webpack-stream',
  __safety: { toString: [Function: bound ] } }

Hi! What I doing wrong, i did:

npm install vue-masked-input --save

import MaskedInput from 'vue-masked-input';

components:{
      MaskedInput
}

And then i'll receive the error: Uncaught SyntaxError: Unexpected token import on import InputMask from 'inputmask-core' at MaskedInput.js

Any clue?

Do you have any idea how to use with vee-validator?

<masked-input type="text" v-model="birth_date" mask="11/11/1111" v-validate data-vv-rules="required" />

I have a vue-cli project and I cannot even setup the plugin to work, is it compatible? For instance, in vuejs 3 you usually have to import the component before you could do but you lack this in the setup guide. I tried it and it still didn't work.

I can't get @blur event to trigger using your library.

Here is the input with your library:

<masked-input type="text" class="form-control" name="birthday" v-model="form.birthday" placeholder="mm/dd/yyyy" mask="11/11/1111" @blur="ageFromBirthday" />

Here is the same thing on a normal input:

<input type="text" class="form-control" name="birthday" v-model="form.birthday" placeholder="mm/dd/yyyy" @blur="ageFromBirthday" />

It just doesn't work with your library, is this a known issue? I am the latest version of your library as well.

Nice code my friend . Congratulations . Can I make a price format mask ?

if I type this -

6756756075607665088

It will shows -

67.567.560.756.076.650,88

Thanks

Hi, in Brazil we have mobile phone like this (xx) x xxxx-xxxx and normal phone like this (xx) xxxx-xxxx

So, using jquery mask I was able do do something like this: $(".phone").mask("(99) 9999-9999?9");

The last number is optional using the question mark, is there a way to do that unsing your component? Thanks

I found an issue with ff-polyfill.js when trying to compile my app for production.

It was throwing an error and failing...

SyntaxError: Unexpected token: punc ()) [./~/vue-masked-input/src/ff-polyfill.js:2,0]

I needed to change

export default () => {

to

export default function() {

then everything worked fine :)

When I have a pre-loaded value on the model, it is changed by the component. Example:

...
    data () {
        return {
            time: '00:00:00:00'
        }
    },
...

<masked-input v-model="time" mask="+ 11:11" />

It doesn't load the value from the time model, instead it overrides with empty value. The only way I made it work was to reset the time variable on mounted() method:

mounted () {
    this.time = '00:00:00:00'
}

I tried to create a mask for numbers with dots as thousands-separator. My mask is in the array-format, and I figured out that each mask entry needs be exactly one character longer:

    [
       '###',
        '####', // workaround to prevent '1.11'
        '#.###',
        '##.###',
        '###.###',
        '####.###', // workaround to prevent '1.000.00'
        '#.###.###',
        '##.###.###',
    ]

The mask itself works fine so far, but if the same character is entered repeatedly, the caret will not end up at the end but move one or two spaces backwards. This seems to happen when the two workaround mask entries are jumped over. If different numbers are entered, the caret stays at the end as intended.

1.0|0 10.000.0|00

Hi, it's a bit offtop, but this widget use plugin inputmask-core, I need to use the same formatting on backend side.

Maybe somebody heard if is there a library similar for this but in php?

Thanx

Hey,

1. input field always disabled

2. when I try to input a text I get an the error

Error in v-on handler: "TypeError: Cannot read property 'setSelection' of null"

Hey, I wanted to add multiple masks to phone input, but it don't really work. <masked-input type="tel" name="phone" v-model.trim="phone" mask="['+\\9\\96 (999) 99-99-99', '+7 (999) 999-99-99']" >

Seems like it don't read arrays

This PR contains various browser compatibility fixes.

Browsers tested:

• Latest Chrome on Linux
• Latest Chrome on Android
• Chrome 30 on Android
• Latest Firefox on Linux
• Latest Edge on Windows
• IE 11 on Windows
• IE 11 on Windows Phone
• Latest Safari on iPhone

Features tested:

• Inserting only letters
• Inserting only numbers
• Inserting only letters on part of field, inserting only number on other part of same field
• Having a prefix
• Backspace
• Set value using .value with vanilla js
• Paste (for IE11 see https://github.com/niksmr/vue-masked-input/pull/45)

i try add autocomplete="off" but it doesnt work too but when i add this in chrome devtools (with plugged android device) it works!!

solution is add autocomplete="off" on focus and remove it on blur