如何在请求验证后使用 Laravel 在下拉列表中显示选定的值？答案

【问题标题】：How to show selected value in dropdown using Laravel after validation from request?如何在请求验证后使用 Laravel 在下拉列表中显示选定的值？
【发布时间】：2020-09-14 18:25:23
【问题描述】：

大家好，我是使用 laravel 的新手，在使用请求验证字段时遇到一些问题：

控制器有两个模型，并加载设备信息到下拉列表：

    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');
    }

请求“SaveChannelReques”有一些规则可以在数据库中添加信息，验证工作正常，但是当返回错误时我无法加载下拉列表：

    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;
    }

查看：

<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>

图片

On page load is ok

Validation fields is ok

No load data after validation request

【问题讨论】：

标签： php laravel eloquent request laravel-blade

【解决方案1】：

问题在于你对old('device', $device->name)的处理
记住要被选中，它们的值代表底层的内在价值

让我们看看

    <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>

最初，“设备”是空的，因此您正在生成一个看起来像的选择列表

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

选择空选项

但是，在验证错误时，您的代码将变为以下

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

没有一个被选中，并且都包含完全相同的 value 和 display

所以你想做以下事情

  <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>

【讨论】：

【解决方案2】：

使用 if error 在下拉列表中加载正确的值：

@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

【讨论】：