Laravel Validator实现字段级错误提示显示在对应输入框下方

我来帮你搞定这个问题！你的核心问题出在控制器返回错误的方式上——你直接返回了错误数组，没有让Laravel把错误信息绑定到视图的错误容器里，所以@error指令根本拿不到对应的错误内容。

问题根源 #

你当前控制器验证失败时返回的是return $data->errors()->all();，这会直接输出错误数组，而不是把错误信息传递回原来的表单视图。Laravel的@error指令依赖于session中的错误容器，必须通过特定方式传递错误才能生效。

修正后的控制器代码 #

public function insertUser(Request $request) {
    $validator = Validator::make($request->all(), [
        'fname' => ['required', 'string', 'max:255'],
        'lname' => ['required', 'string', 'max:255'],
        'uname' => ['required', 'string', 'max:255'],
        'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
        'password' => ['required', 'string', 'min:8', 'confirmed'],
    ]);

    if ($validator->fails()) {
        // 用withErrors传递验证器实例，Laravel自动绑定错误到视图错误容器
        // 加上withInput()保留用户输入内容，优化体验
        return back()->withErrors($validator)->withInput();
    } else {
        // 这里补充创建用户的逻辑（你原来的代码缺失这部分）
        // User::create([
        //     'fname' => $request->fname,
        //     'lname' => $request->lname,
        //     'uname' => $request->uname,
        //     'email' => $request->email,
        //     'password' => Hash::make($request->password),
        // ]);
        
        return back()->with('success','Successfully Registered!');
    }
}

关键修改说明 #

• back()->withErrors($validator)：这会将验证失败的错误信息存入session，视图中的@error('字段名')就能精准匹配到对应字段的错误提示，自动触发输入框下方的错误显示逻辑。
• withInput()：可选但推荐，用户提交失败后，之前填写的内容会被保留在表单中，无需重新输入，提升用户体验。

视图代码无需修改 #

你的HTML视图代码已经正确实现了@error指令和错误样式的绑定，只要控制器正确传递错误信息，就能自动将错误提示显示在对应输入框下方，同时给输入框添加is-invalid的样式类。

最后提醒：别忘了在验证通过的分支里补充创建用户的逻辑，不然只是返回成功提示，实际并没有把用户数据存入数据库哦！

内容的提问来源于stack exchange，提问作者Pablo