Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

guillermo_rojas's avatar

Confused with Laravel Validation and Vue

Hie everyone. I'm starting to develop on Vue.js.

Long story short: I'm making a form, and without Vue, every validation works as it should be. The problem is when I added some Vue code, the validation (such as checkboxes -- booleans), they started to fail saying "The field rent should be true or false"

I've tried the <pre>@{{data}}</pre>, to try what's inside this variable:

Here's my code; remember it's tooooo long, so I will write a simple example

Model:

class Property extends Model
{
    use SoftDeletes;

    protected $table = "properties";
    protected $fillable = [
     'offer', 'sale', 'rent',
}

PropertyRequest.php

class PropertyRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }
    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            'offer'=> 'boolean|',
            'rent'=> 'boolean|',
            'sale'=> 'boolean|',
        ];
    }
}

View

<div class="form-group">
    {!! Form::open(['route' =>'admin.properties.store', 'method' => 'POST']) !!}
        <div class="form-group">
            {!! Form::hidden('offer', 0) !!}
                {!! Form::checkbox('offer', null, null, ['v-model' => 'management.offer']) !!}
                {!! Form::label('offer', 'Oferta')!!}
    </div>

    <div class="form-group">
        {!! Form::hidden('rent', 0) !!}
        {!! Form::checkbox('rent',null, null, ['v-model' => 'management.rent']) !!}
        {!! Form::label('rent', 'Arriendo')!!}
    </div>

    <div class="form-group">
        {!! Form::hidden('sale', 0) !!}
        {!! Form::checkbox('sale', null, null, ['v-model' => 'management.sale']) !!}
        {!! Form::label('sale', 'Venta')!!}
    </div>

    <div class="form-group">
        {!! Form::submit('Save property', ['class' => 'btn btn-success'])!!}
    </div>

    {!! Form::close() !!}
</div>





<script>
        var app = new Vue({
            el: '#app',
            data: {
                management: {
                    property_type: null,
                    owner_id: null,
                    client_id: null,
                    owner_id: null,
                    offer: null,
                    rent: null,
                    sale: null

                }
    });
</script>

As soon as I click the submit button, form validations appears, and says "the rent field(among others), must be true or false", even when I click the offer , or rent checkbox

I've also tried

PropertyController.php

public function store(PropertyRequest $request)
{
    dd($request); // I can't reach at this point
}

What am I doing wrong? and how could I do it, in a 'right-way'?

EDIT

I've change the validation rules to false and

PropertyController.php

public function store(Request $request)
{
    dd($request); // Now I can
}

I've checkd the values from the checkboxes, and those who were clicked, the value was 'on' instead of '1'

Is this some kind of bug? Any help would be appreciated

0 likes
0 replies

Please or to participate in this conversation.