CODEWITHSUNDEEP
javascriptlaravelvue.jsvuejs2element-ui
Jeremy
Jeremy

Reputation: 1952

How to obtain success validateState with :error in element-ui vuejs

I create an application with Laravel / Vuejs and Element-ui. In my form, I use the property: error to tell my field that I'm using a Laravel validation.

<el-form-item label="Prénom" prop="firstname" :error="registerForm.errors.get('firstname')">
    <el-input name="firstname" id="firstname" v-model="registerForm.firstname">
    </el-input>
/el-form-item>

On the following link (http://element.eleme.io/#/en-US/component/form#validation) we can see that when there is an error, the field comes red (it works with me) and when we fill the field correctly, the field turns green.

When there is an error, the validateState data gets the value "error". Using :error as validation, when the validation is correct, the property does not pass in "success", which makes it possible to trigger the green field.

How to make validateState pass in success when the error is corrected as in the example of the link?

thank you very much

Upvotes: 1

Views: 2435

Answers (1)

ittus
ittus

Reputation: 22403

If you want to set is-success class manually, you can bind is-success class to el-form-item

<el-form-item label="Prénom" prop="firstname" :error="registerForm.errors.get('firstname')"
:class="{'is-success': !registerForm.errors.get('firstname')}">
    <el-input name="firstname" id="firstname" v-model="registerForm.firstname">
    </el-input>
</el-form-item>

Upvotes: 2

Related Questions