Laravel 表单提交后保留下拉选中状态

本文旨在解决 Laravel 应用中表单提交后下拉列表（select）重置的问题。通过利用 Laravel 提供的 request 对象和旧输入值功能，我们能够轻松地在页面刷新后保持用户在下拉列表中选择的选项，从而提升用户体验。本文将详细介绍如何在视图中正确地处理下拉列表的选中状态，并提供相应的代码示例和注意事项。

在 Laravel 应用中，表单提交后页面刷新，下拉列表恢复到默认状态是一个常见的问题。为了解决这个问题，我们需要利用 Laravel 的 request 对象来获取表单提交时选择的值，并在视图中设置 selected 属性。

核心思路：

在表单提交后，通过 request() 辅助函数获取 smsstaff_key 的值，然后在循环生成 option 标签时，判断当前 staffMember->smsstaff_key 是否等于 request('smsstaff_key')，如果相等，则添加 selected="selected" 属性。

实现方法：

以下是修改后的视图代码：

    

        

            Pick a staff member
            
                @foreach ($staff as $staffMember)
                    smsstaff_key ? 'selected' : '' }}>{{$staffMember->name}}
                @endforeach
            
            

                Filter by selected staff member
            
        
        

            From:
            
        
        

            To:
            
        
        

            Export filtered
        
    
    

        All to Excel
    

代码解释：

• request('smsstaff_key'): 使用 Laravel 的 request() 辅助函数来获取名为 smsstaff_key 的请求参数的值。
• {{ request('smsstaff_key') == $staffMember->smsstaff_key ? 'selected' : '' }}: 这是一个三元运算符，判断 request('smsstaff_key') 是否等于当前循环的 $staffMember->smsstaff_key。如果相等，则输出 selected，否则输出空字符串。这会将 selected 属性添加到对应的 option 标签中。

注意事项：

1. 确保请求参数存在： 如果在某些情况下 smsstaff_key 可能不存在于请求中，建议使用 request()->has('smsstaff_key') 来检查参数是否存在，以避免潜在的错误。例如：

   has('smsstaff_key') && request('smsstaff_key') == $staffMember->smsstaff_key ? 'selected' : '' }}>{{$staffMember->name}}

2. 类型转换： 如果 smsstaff_key 是数字类型，而从请求中获取的值是字符串类型，可能需要进行类型转换，以确保比较的准确性。可以使用 (int) request('smsstaff_key') 将请求参数转换为整数。

3. selected="selected" vs selected: 在 HTML5 中，selected 属性只需要存在即可，不需要指定值。因此，可以使用简写的 selected 代替 selected="selected"。

4. 避免使用 JavaScript： 尽量避免使用 JavaScript 来设置选中状态，因为 Laravel 提供了更简洁和优雅的解决方案。

总结：

通过使用 Laravel 的 request() 辅助函数和三元运算符，我们可以轻松地在表单提交后保持下拉列表的选中状态，从而改善用户体验。 记住要检查请求参数是否存在，并进行必要的类型转换，以确保代码的健壮性。