CODEWITHSUNDEEP
phplaraveleloquentrequestlaravel-blade
giotoapanta
giotoapanta

Reputation: 3

How to show selected value in dropdown using Laravel after validation from request?

Hi guys i'm new using laravel and I have somo problems when use a request to validate fields:

  1. Controller has two model, and load device information to dropdown:
    use App\Channel;  //channel model
    use App\Device;   //device model
    public function create()
    {
        return view('partials.channels.create',[
            'channel' => new Channel,
            'devices' => Device::latest()
        ]);
    }
    public function store(SaveChannelRequest $request)
    {
        Channel::create($request->validated());
        return redirect()->route('channels.index');
    }
  1. Request "SaveChannelReques" has some rules to add information on database, validations work fine but when return error I can't load the dropdown:
    public function rules()
    {
        $bypass = $this->channel->id ?? "";
        $rules = [
            'channel' => 'required|unique:channels,channel,'.$bypass.',id',
            'name' => 'required|unique:channels,name,'.$bypass.',id',
            'device' => 'required',
            'description' => 'required',
            'latitude' => 'nullable',
            'longitude' => 'nullable',
            'elevation' => 'nullable',
            'field1' => 'nullable',
        ];
        return $rules;
    }
  1. View:
<form class="bg-white shadow rounded py-3 px-4" method="POST" action="{{ route('channels.store') }}">
<div class="form-group">
    <label for="device">{{ __('Device') }}</label>
    <select id="device" name="device" class="form-control @error('device') is-invalid @enderror" autocomplete="device">
        <option value="" selected >@lang('Choose')...</option>
        @foreach($devices as $device)
            <option value="{{ old('device', $device->name) }}">{{ old('device', $device->name) }}</option>
        @endforeach
    </select>
    @error('device')
    <span class="invalid-feedback" role="alert">
        <strong>{{ $message }}</strong>
    </span>
    @enderror
</div>
<div class="form-row">
    <div class="form-group col-md-6">
        <label for="channel">{{ __('Channel') }}</label>
        <input id="channel" type="text" class="form-control bg-light shadow-sm @error('channel') is-invalid @enderror" name="channel" value="{{ old('channel', $channel->channel) }}" autocomplete="channel" autofocus>
        @error('channel')
        <span class="invalid-feedback" role="alert">
            <strong>{{ $message }}</strong>
        </span>
        @enderror
    </div>
    <div class="form-group col-md-6">
        <label for="name">{{ __('Name') }}</label>
        <input id="name" type="text" class="form-control bg-light shadow-sm @error('name') is-invalid @enderror" name="name" value="{{ old('name', $channel->name) }}" autocomplete="name" autofocus>
        @error('name')
        <span class="invalid-feedback" role="alert">
            <strong>{{ $message }}</strong>
        </span>
        @enderror
    </div>
</div>
</form>
  1. Images

On page load is ok

Validation fields is ok

No load data after validation request

Upvotes: 0

Views: 4429

Answers (2)

nikistag
nikistag

Reputation: 694

Use if error to load right value in dropdown:

@foreach($devices as $device) 
   @ if (old('device' ) == $device->name)
        <option value="{{ $device->name}}" selected>{{ $device->name}}</option>
    @else
        <option value="{{ $device->name}}">{{ $device->name}}</option>
    @endif
@endforeach

Upvotes: 0

gofish
gofish

Reputation: 375

The problem lies within your handling of old('device', $device->name)
Remember that are to be selected, their value represents the underlying inner value

So let's look at

    <select id="device" name="device" class="form-control @error('device') is-invalid @enderror" autocomplete="device">
        <option value="" selected >@lang('Choose')...</option>
        @foreach($devices as $device)
            <option value="{{ old('device', $device->name) }}">{{ old('device', $device->name) }}</option>
        @endforeach
    </select>

Initially, 'device' is empty, so you are generating a select list that looks like

<option value="" selected>...</option>
<option value="{{ $device->name }}>{{ $device->name }}</option>

With the empty option being selected

However, on validation error your code becomes the following

<option value="" selected>...</option>
<option value="{{ old('device') }}>{{ old('device' }}</option>

with none of them being selected and all housing the exact same value and display

So you want to do the following

  <select id="device" name="device" class="form-control @error('device') is-invalid @enderror" autocomplete="device">
        <option value="">@lang('Choose')...</option>
        @foreach($devices as $device)
            <option {{ old('device') == $device->name ? 'selected="selected"' : '' }} value="{{ $device->name }}">{{ $device->name }}</option>
        @endforeach
    </select>

Upvotes: 1

Related Questions