Saturday, May 20, 2017

How to make Vue not replace my old value after the server side validation

I'm was using server side validation with laravel and fecthing the old value in case there was a validation error.

<input type="text" class="form-control" name="nombre" value="">

But now I need to validate that input on the client with vue, cause it's required for other stuff.

<input type="text" class="form-control" name="nombre" value="" v-model="vNombre" v-on:keyup="validarNombre">

The problem is that when the validation fails on the server side the old input value get's replaced with an empty string cause Vue is initializing that variable. Please help, thanks for reading.

<script type="text/javascript">
  var avatar = new Vue({
    el: '#validaciones',
    data: {
      vNombre: '',
      validNombre: false,
    },
    methods: {
      validarNombre: function(){
        if (this.vNombre == '') {
          this.validNombre = false
        }
        else {
          this.validNombre = true;
        }
      }
    }
  })
</script>



via somezombie

Advertisement