I have a select html tag in livewire view:
<select wire:model="categoryId" wire:change="$emit('attr_cat', $event.target.value)" name="category_id" class="form-control">
<option value="0">Select category</option>
@foreach($categories as $category)
<option value="{{$category->id}}">{{ $category->name }}</option>
@if(count($category->childs))
@include('admin.categories.subcategorylist',['childs' => $category->childs])
@endif
@endforeach
</select>
and a livewire component with following code:
namespace App\Http\Livewire\Admin;
use App\Models\Attribute;
use App\Models\Category;
use App\Models\CategoryAttribute;
use Barryvdh\Debugbar\Facade as Debugbar;
use Livewire\Component;
class CategoryAttributes extends Component
{
public $attributeId;
public $categoryId;
public $attributeCategories;
public $categories;
protected $listeners = ['attr_cat' => 'addAttributeToCategory'];
public function mount()
{
$this->attributeCategories = Attribute::find($this->attributeId)->categories()->get();
$this->categories = Category::whereNull('category_id')->orderBy('name')->with('childs')->get();
$this->categoryId = 0;
}
public function render()
{
return view('livewire.admin.category-attributes');
// return view('livewire.admin.cat-attr-test');
}
public function addAttributeToCategory($value){
Debugbar::addMessage($value);
CategoryAttribute::create([
'category_id' => $this->categoryId,
'attribute_id' => $this->attributeId,
]);
}
public function updatedCategoryId(){
Debugbar::addMessage($this->attributeId);
}
}
and mount livewire component with this line in my blade view:
@livewire('admin.category-attributes', ['attributeId' => $attribute->id], key('attr-'.$attribute->id))
but, when I change selected item, nothing happens and no xhr requests are sent to the server by the browser.
Let me say this too, I have inserted @livewireStyles and @livewireScripts in master blade file and they are loaded correctly. Thank you for your help.
I found the solution to my problem. I had to put all the contents of the view in a standalone tag so that livewire could assign an ID to it. Otherwise, livewire will refuse to send any request to the server.
Livewire view code:
<div>
<select wire:model="categoryId" wire:change="$emit('attr_cat', $event.target.value)" name="category_id" class="form-control">
<option value="0">Select category</option>
@foreach($categories as $category)
<option value="{{$category->id}}">{{ $category->name }}</option>
@if(count($category->childs))
@include('admin.categories.subcategorylist',['childs' => $category->childs])
@endif
@endforeach
</select>
</div>