search

kazupon / vue-validator

:white_check_mark: Validator component for Vue.js
MIT License
2.19k stars 431 forks source link

Can I check if input has value? #328

Open lavezzi1 opened 7 years ago

lavezzi1 commented 7 years ago

vue 1.0.28 validator 2.1.7

Can I check if input has value (initially when page is loaded?) then apply some class? I know I can work with 'modified' event but it works only when user change value. Thanks!

kazupon commented 7 years ago

Yes, you can do. As far as I understand your comment, the following.

<div id="app">
  <validator name="validation1">
    <input type="text" :value="msg" v-validate:comment="['required']"/>
  </validator>
</div>
lavezzi1 commented 7 years ago

@kazupon I'll try to explain deeply. I want to implement floated label, so when you click on input and enter some value the label should appear on the top left corner. I can do this:

:class={'show-label': $validation.modified}

But problem comes when input has some value initially. So how to determine that input already modified or something? And apply the show-label initially in this case.

sqal commented 7 years ago

@lavezzi1 Why dont' you simply add the class when model's value is not empty:

<input v-model="msg" :class="{ 'show-label': msg !== '' }" type="text" />

I don't think your problem is related to vue-validator.