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

Eloïse's avatar

Livewire @entangle not working

Hello, I'm building an app based on laravel 11 and livewire 3, I'm used to Livewire and from the beginning of this new project @entangle is not working what do I missed ? The value of $selectedCategoryId is not updated when I change the select but the alpine value is correctly changed when I check in the devtools, so the value does not go back to the controller.

<?php

namespace App\Livewire;

use Livewire\Component;

class SelectCategoryAndType extends Component
{

    public mixed $categories ;
    public mixed $types;
    public $selectedCategoryId;

    public function mount()
    {
        $this->categories = \App\Models\Categorytype::orderBy('name')->get();
        $this->selectedCategoryId = $this->categories[2]->id;
        $this->getOperationsTypes($this->selectedCategoryId);
    }


    public function updatedSelectedCategoryId()
    {
        $this->getOperationsTypes($this->selectedCategoryId);
    }

    public function getOperationsTypes(int $categoryId)
    {

        $this->types = \App\Models\Operationstype::where('categorytype_id', $categoryId)->get();

    }

    public function render()
    {
        return view('livewire.select-category-and-type');
    }
}

here is the view

<div class="col-span-2 w-full"
     x-data="{selectedCategory: @entangle('selectedCategoryId')}"
>
    <div class="col-span-2 w-full">
        <label   for="category_id" class="">Catégorie<span class="mandatory">*</span></label>
        <select x-model="selectedCategory" id="category_id" name="category_id" class="">

            @foreach($categories as $category)
                <option {{ $selectedCategoryId===$category->id ? 'selected' : '' }} value="{{ $category->id }}">{{ $category->name }}</option>
            @endforeach

        </select>
        <p class="mt-3 text-sm leading-6 text-gray-500"></p>
    </div>
    <div class="col-span-2 w-full">
        <label for="operationtype_id" class="">Type d'opération<span class="mandatory">*</span></label>
        <select id="operationtype_id" name="operationtype_id" class="">

            @foreach($types as $type)
                <option value="{{ $type->id }}">{{ $type->name }}</option>
            @endforeach

        </select>
        <p class="mt-3 text-sm leading-6 text-gray-500"></p>
    </div>
</div>
0 likes
2 replies
Eloïse's avatar
Eloïse
OP
Best Answer
Level 2

OK, I found the solution, just add .live after @entangle directive like this :

selectedCategory: @entangle('selectedCategoryId').live
1 like

Please or to participate in this conversation.