What instance property is receiving the categories from the form; you have a $categories property that is your Collection of Category instances? Sort out your class properties!
Mar 1, 2024
9
Level 2
Livewire - Multiple checkboxes (all checked when only one value is...)
Hello,
I am using Livewire 2.3 I would like to filter products with checkboxes (categories and subcategories). But, when I go to this page : /shop?categories=clothes All checkboxes are visually checked (according to the debugbar there is only "clothes" in the variable).
Here is my blade :
<div class="d-flex align-items-center">
<input type="checkbox" wire:model="categories" value="clothes" id="clothes">
<label for="clothes">clothes</label>
</div>
<div class="d-flex align-items-center">
<input type="checkbox" wire:model="categories" value="shoes" id="shoes">
<label for="shoes">shoes</label>
</div>
Here is my component :
class Collection extends Component
{
public $current_categories;
public $current_subcategories;
public $search_result;
// Get filtered categories
public $db_categories = [];
public $db_subcategories = [];
protected $queryString = [
'current_categories' => ['except' => '', 'as' => 'categories'],
'current_subcategories' => ['except' => '', 'as' => 'subcategories'],
];
public function mount()
{
$this->categories = Category::whereNull('parent_category_id')->with(['subcategories'])->get();
$this->updatedCurrentCategories($this->current_categories);
$this->updatedCurrentSubcategories($this->current_subcategories);
}
public function updatedCurrentCategories($values)
{
$array_current_categories = $values ? explode(',', $values) : [];
if ($array_current_categories) {
$this->db_categories = Category::whereIn('slug', $array_current_categories)->get();
}
}
public function filter()
{
// Query to fetch products according to the $db_categories (filters)
}
public function render()
{
$this->search_result = [];
$this->filter();
return view('livewire.shop');
}
I tried to split the model this way: wire:model="categories.clothes". It works, but I do not want to do it this way. Because I want to keep a clean URL.
Thanks for your help!
Please or to participate in this conversation.