vue-lorm

Lorm

Tiny form helper for Vue.js.

Example Form

<form class="form-horizontal">
    <div class="form-group" :class="{ 'has-error': form.errors.has('name') }">
        <label for="name" class="col-md-4 control-label">Name</label>
 
        <div class="col-md-6">
            <input id="name" type="text" class="form-control" name="name" required>
 
            <span class="help-block" v-show="form.errors.has('name')">
                <strong>{{ form.errors.first('name') }}</strong>
            </span>
        </div>
    </div>
    
    <div class="form-group" :class="{ 'has-error': form.errors.hasErrors() }">
        <div class="col-md-offset-4 col-md-6">
            <button class="btn btn-primary"
                    @click.prevent="register"
                    :disabled="form.busy">
 
                Register
            </button>
        </div>
    </div>
</form>
<script>
    export default {
        data() {
            return {
                form: new Lorm({
                    name: ''
                })
            };
        },
 
        methods: {
            register() {
                this.form.post('/accounts').then(data => {
                    alert('Account created!');
                });
            }
        }
    }
</script>