在Laravel 5.8中提交后，使用@error指令将多个输入字段中的先前输入字段作为目标 [英] Using @error directive to target the previous input field from multiple input fields after submit in Laravel 5.8

问题描述

新的@error指令是在Laravel 5.8.13 中引入的.因此，不要这样做:

The new @error directive was introduced in Laravel 5.8.13. So, instead of doing this:

// old
@if ($errors->has('email')) 
    <span>{{ $errors->first('email') }}</span> 
@endif

您现在可以执行此操作

// new
@error('email') 
    <span>{{ $message }}</span> 
@enderror

但是，在尝试仅将几个错误的输入字段中发生错误的输入字段作为目标时，我遇到了问题.这些字段相似，因为它们具有相同的名称.但是它们的格式也不同，并且具有不同的提交按钮.

However, I'm having issues trying to target only the input fields where the error was made among several similar input fields. These fields are similar because they have the same name. But they are also in seperate forms and have different submit buttons.

使用从 @forelse 语句生成的多个输入来设置我的html刀片文件.我创建了一个简单的错误检查，以检查是否输入了负数，并通过错误消息重定向回同一页. @error 指令还用于将自定义类插入目标输入字段以进行样式设置.

My html blade file is setup with multiple inputs generated from a @forelse statement. I've created a simple error check to check if a negative number is entered and to redirect back to the same page with an error message. The @error directive is also used to insert a custom class to target input field for styling.

@forelse($accounts as $account)
    <form method="POST" action="{{ route('account.update', $account->id) }}">
        @csrf
        <div>
            <input type="number" name="credit" class="@error('credit') is-invalid @enderror" required>
            <input type="submit" class="btn" value="ok">
            @error('credit')
                <span class="invalid-feedback" role="alert">
                    <strong>{{ $message }}</strong>
                </span>
            @enderror
        </div>
    </form>
@empty
@endforelse

该表单将提交到 AccountController.php

public function update(Request $request, Account $account)
{
    if($request->input('credit') < 0)
    {
        return back()->withErrors(['credit'=>'enter a positive amount']);
    }
    // ... other logic
}

问题是，当在一个输入字段中输入负数时，即使输入格式不同，对于具有相同名称的每个输入也会显示错误消息.

The problem is that when a negative number is entered in one input field, the error message shows up for every input with the same name, even when they are not in the same form.

我认为使输入名称唯一可以解决此问题，但这会使后端逻辑比所需的更加复杂.

I think making the input names unique will solve this, but this will make my backend logic more complex than is required.

无论如何，重定向后是否仅针对目标输入显示错误消息，而不必为每个输入字段使用唯一的名称?

Is there anyway of making the error message show for just the target input after the redirect, without having to use unique names for each input field?

推荐答案

有趣的是， @error 指令不是通过编程方式通过输入名称绑定到任何输入字段的.它仅在空间上与输入字段相关，并且与邻近区域相关，并且可以放置在页面上的任何位置.

Interestingly, the @error directive is not programmatically tied to any input field by an input name. It is only spatially related to an input field by proximity and can be placed any where on the page.

此外，您可以方便地使用 @error 指令中的任何字符串，只要将其传递到控制器中的 withErrors()调用即可.

Also, you can conveniently use any string within the @error directive as long as same is passed to the withErrors() call in the controller.

因此，解决在多个输入中定位适当输入的问题变得像使用 any 唯一字符串(不一定是目标输入名称)作为输入中的键一样简单. withErrors()方法调用并通过将相同的字符串传递给 @error 指令来检索错误消息.就我而言，我选择使用帐户ID作为唯一字符串.

So, solving the problem of targeting the appropriate input among multiple ones becomes as simple as using any unique string (not necessarily the target input name) as key in the withErrors() method call and retrieving the error message by passing the same string to the @error directive. In my case, I chose to use the account id as the unique string.

在 AccountController.php 中:

public function update(Request $request, Account $account)
{
    if($request->input('credit') < 0)
    {
        return back()->withErrors([$account->id=>'enter a positive amount']);
    }
    // ... other logic
}

在html刀片模板中:

And in the html blade template:

@forelse($accounts as $account)
    <form method="POST" action="{{ route('account.update', $account->id) }}">
        @csrf
        <div>
            <input type="number" name="credit" class="@error($account->id) is-invalid @enderror" required>
            <input type="submit" class="btn" value="ok">
            @error($account->id)
                <span class="invalid-feedback" role="alert">
                    <strong>{{ $message }}</strong>
                </span>
            @enderror
        </div>
    </form>
@empty
@endforelse

注意:在任何 @error 伪指令中使用不存在的键会破坏其他@error伪指令的代码，并且不会显示任何错误消息.

NOTE: Using a non existent key in any @error directive breaks the code for other @error directives and will cause no error messages to be displayed.

这篇关于在Laravel 5.8中提交后，使用@error指令将多个输入字段中的先前输入字段作为目标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！