Data from a Livewire sub-form missing in request

Question

In Laravel, I'm using livewire to dynamically render parts of an HTML form. The main form is a regular Laravel blade file and is not a Livewire component. However, the values of the fields in the livewire sub-form are missing in the $request variable when the form is submitted.

snippet of the edit.blade.ph containing the livewire component. This file is a regular view blade file, not a Livewire component.

<div class="row mb-3">
  <textarea id="address" type="text" class="form-control @error('address') is-invalid @enderror" name="address" required autocomplete="address" rows="3">{{ $player->address}}</textarea>
</div>
@livewire('address-input', ['player'=> $player])
<div class="row mb-3">                                    
    <textarea id="description" type="text" class="form-control @error('description') is-invalid @enderror" name="description" required autocomplete="description" rows="3">{{ $player->description}}</textarea>
</div>

Livewire component address-input.blade.php

<div class="row mb-3">
    <label for="region" class="col-md-4 col-form-label text-md-end">{{ __('Region') }}</label>

    <div class="col-md-6">
        <select wire:model="region" class="form-select" aria-label="Region Label">
            <option selected>Select Region</option>
            @foreach($regions as $region)
                <option value="{{$region->id}}">{{$region->region_name}}</option>
            @endforeach
        </select>
    </div>
</div>

<div class="row mb-3">
    <label for="province" class="col-md-4 col-form-label text-md-end">{{ __('Province') }}</label>

    <div class="col-md-6">
        <select wire:model="province" class="form-select" aria-label="Province Label">
            <option selected>Select Province</option>
            @foreach($provinces as $province)
                <option value="{{$province->id}}">{{$province->name}}</option>
            @endforeach
        </select>

    </div>
</div>

<div class="row mb-3">
    <label for="municipality" class="col-md-4 col-form-label text-md-end">{{ __('Municipality') }}</label>

    <div class="col-md-6">
        <select wire:model="municipality" class="form-select" aria-label="Province Label">
            <option selected>Select Municipality</option>
            @foreach($municipalities as $municipality)
                <option value="{{$municipality->id}}">{{$municipality->name}}</option>
            @endforeach
        </select>


    </div>
</div>

<div class="row mb-3">
    <label for="barangay" class="col-md-4 col-form-label text-md-end">{{ __('Barangay') }}</label>

    <div class="col-md-6">
        <select id="barangay_id" class="form-select" aria-label="Barangay Label">
            <option selected>Select Barangay</option>
            @foreach($barangays as $barangay)
                <option value="{{$barangay->id}}">{{$barangay->name}}</option>
            @endforeach
        </select>

    </div>
</div>

When the form on edit.blade.php is submitted, the values on the input fields in the address-input sub-form are not included in the request, specifically, the value for barangay_id.

Output of dd($request).

Answer 1

Ohh, silly me.

I forgot to include the name attribute on the field elements.