Laravel 8 - 如何保持无线电“检查” `validate()` 刷新后字段可见吗？

Question

我有一张表格，上面写着“这个箱子有 IR 号码吗？”
如果是，则显示字段。如果不是，则隐藏并向其他人展示。

我正在使用

• validate() 函数。
• old() 用于在表单提交失败后保留数据，也称为 validate() 错误消息。
• JQuery 显示/隐藏字段。

对于无线电输入，我使用了 old() ，如下所示：

<input class="btn-check" type="radio" name="checkIR" value="haveIR" @if(!old('checkIR')) checked @endif id="haveIR" required>
<input class="btn-check" type="radio" name="checkIR" value="noIR" @if(old('checkIR')) checked @endif id="noIR">

在 validate() 失败后保持 checked 不变，但它有错误，当我检查“是”并刷新时，它在必须为“是”时检查“否”。

至于显示/隐藏，这是我所做的：

// Show/Hide fields based on radio button option
    $(document).ready(function() {
        $('input[name="checkIR"]').click(function() {
            var inputValue = $(this).attr("value")
            var targetField = $("." + inputValue);
            $(".box").not(targetField).slideUp();
            $(targetField).slideDown();
        });
    });

在CSS的帮助下：

.box {
  display: none;
}

代码如何工作：
如果选中 yes/haveIR 单选：显示包含 class="box haveIR"

尝试解决的问题：

• 如何修复的 所有字段/改善输入old()中的小错误？
• 如果用户选中“yes”，即使 Laravel validate() 失败，如何保持 yes 字段可见？

Answer 1

由于无线电输入具有相同的名称，因此在这两种情况下，您的会话都有“checkIR”，并且当您尝试使用 old('checkIR') 检查它时，无论其值如何，它都会返回 true。这就是为什么选中“否”的原因。

因此，为了找到旧的选定项，您应该检查它的值，而不是它是否存在于会话中。

这样的代码应该适合你；

<input class="btn-check" type="radio" name="checkIR" value="haveIR" @if(old('checkIR') == 'haveIR') checked @endif id="haveIR" required>

<input class="btn-check" type="radio" name="checkIR" value="noIR" @if(old('checkIR') == 'noIR') checked @endif id="noIR">

或者;

您可以使用 0 和 1 作为值。由于 old('checkIR') 将返回 '0' 或 '1' 并且 PHP 会将 '0' 解释为 false，将 '1' 解释为 true，因此行为将如您所愿。

并保持相关字段可见；

您可以在文档准备好时运行一些脚本，并通过输入值设置相关字段可见。

$(document).ready(function() {
    var input = $('input[name="checkIR"]:checked');
    if (input) { // if any checked radio when document ready
        var targetField = $("." + input.val());
        $(".box").not(targetField).slideUp();
        $(targetField).slideDown();
    }
});

注意：没有运行脚本，它可能有错误，但你明白了。