I’m currently on Laravel 8 with Livewire. There are two input select boxes in a form, how can I conditionally display, either of the select boxes based on the radio button checked. I want to achieve the result without jQuery, please help me.
This is what I want to achieve:
Need to switch between these two:
<div class="mb-2">
<label for="category_id" class="block">Category ID</label>
<select wire:model="category_id" name="category_id" id="category_id" class="shadow appearance-none border rounded w-full py-2 px-3 text-blue-900">
<option>Select Option</option>
@foreach($categories as $category)
<option value="{{ $category->id }}">{{ $category->category_name }}</option>
@endforeach
@error('category_id') <h1 class="text-red-500">{{$message}}</h1>@enderror
</select>
</div>
<div class="mb-2">
<label for="sub_category_id" class="block">Sub-Category ID</label>
<select wire:model="sub_category_id" name="sub_category_id" id="sub_category_id" class="shadow appearance-none border rounded w-full py-2 px-3 text-blue-900">
<option>Select Option</option>
@foreach($subcategories as $subcategory)
<option value="{{ $subcategory->id }}">{{ $subcategory->sub_category_name }}</option>
@endforeach
@error('sub_category_id') <h1 class="text-red-500">{{$message}}</h1>@enderror
</select>
</div>