如何發布有條件的已禁用/只讀輸入字段？

Question

我試圖使輸入字段處於禁用狀態或只讀狀態（如果尚未按下按鈕），但是在添加使其變為禁用狀態或只讀狀態后，我在將其發布/提交到數據庫時遇到問題

    <form action="{{ route('amber.timestone.home.start', $task->id) }}" method="POST" class="align-center">
                                {{csrf_field()}}
                            <td>
                                <input class="my-2" type="text" name="ref" value="{{ $task->ref }}"
                                    @if(empty($task->start))
                                        readonly
                                    @endif
                                >


public function startTask($id)
    {
        $user = Task::find($id);
        $user->start = Carbon::now();
        $user->save();
        return back();
    }
public function endTask($id, Request $request)
    {
        $user = Task::find($id);
        $user->end = Carbon::now();
        $start = Carbon::parse($user->start);
        $end = Carbon::parse($user->end);
$user->ref = request('ref');
        $user->remarks = request('remarks');
        $user->campaign = request('campaign');
        $user->type = request('type');
            $hours = $end->diffInHours($start);
            $minutes = $end->diffInMinutes($start);
            $seconds = $end->diffInSeconds($start);
            $user->duration = $hours . ':' . $minutes . ':' . $seconds;
            $user->update();
            return back();
        }

我嘗試添加與那些具有只讀條件的名稱相同的隱藏名稱仍然無法正常工作

Answer 1

禁用字段不隨請求一起發布，但是您可以添加只讀屬性。

您可以做的另一件事是，出於UI目的禁用字段，並在下面添加具有相同名稱和值的隱藏輸入。

Answer 2

HTML是一種標記語言，它突出顯示數據的語義，而不是顯示數據的方式（例如，使用<strong>使文本加粗是完全錯誤的方式）。 因此，您應該使用CSS定制的文本容器（主要是<div>或<span> ）將其封裝並保持只讀。 然后，就像Adam abdul shakoor所建議的那樣，您可以使用具有相同值的隱藏輸入。 您還應該考慮使用VueJS（已經打包在Laravel中），它的數據驅動方法使這種事情變得微不足道，以保持容器和輸入的內容同步。

Answer 3

你怎么看？ 如果您有需要返回的值，請將其放在隱藏的輸入字段中。 因此，也許可以使用CSS創建一個偽字段。 但是，如果您不想發送任何數據，只是為了顯示它，您可能根本就不會在隱藏輸入字段中包含該值。