[Vuejs]-Laravel: Property or method is not defined on the instance but referenced during render

by

0👍

✅

You are binding the model to a div, which only works for inputs, if you want to only show or hide the div, change the v-model to v-if

<div class="management-area" id="app" style="position: absolute;top: 4rem;left: 200px;right: 0;">
    <div class="flex-container">
<div class="columns m-t-10">
    <div class="column">
        <h1 class="title">Edit User</h1>
    </div>
</div>
<div class="columns">
    <div class="column">
        <h1 class="m-t-0"></h1>
        <form action="{{route('users.update', $user->id)}}" method="POST">
        {{method_field('PUT')}}
        {{csrf_field()}}
            <div class="field">
                <label for="name" class="label">Name</label>
                <p class="control">
                    <input type="text" class="input" name="name" id="name" value="{{$user->name}}">
                </p>
            </div>
            <div class="field">
                <label for="email" class="label">Email</label>
                <p class="control">
                    <input type="email" class="input" name="email" id="email" value="{{$user->email}}">
                </p>
            </div>
            <div class="field">
                <label for="password" class="label">Password</label>
                <b-form-checkbox-group v-model="password_options">
                    <div class="field">
                        <b-form-checkbox value="keep">Do Not Change Password</b-form-checkbox>
                    </div>
                    <div class="field">
                        <b-form-checkbox value="auto">Auto-Generate New Password</b-form-checkbox>
                    </div>
                    <div class="field">
                        <b-form-checkbox value="manual">Manually Set New Password</b-form-checkbox>
                        <p class="control">
                        <input type="text" class="input" name="password" id="password" v-if="password_options == 'manual'" placeholder="Manually give a password to this user" required>
                        </p>
                    </div>   
                </b-radio-group>           
            </div>  
            <button class="button is-primary">Edit User</button>
        </form>
    </div>
</div>

Leave a comment