laravel foreachで本来1つだけ作りたいselect boxが複数できてしまうことの解決策

Question

##現状
ControllerでModel（Client.php）から引っ張ってきたデータを、checkClient.blade.phpというビュー上にforeachで展開するというコードを記述しました。

しかし、foreachがselect boxを生み出す<select>タグにまたがっており、Client.phpのカラムの数だけselect boxが生み出されるという形になっています。

（以下は、2つのカラムが挿入されている状態）

foreachがselect boxを生み出す<select>タグにまたがらないようにすればいいということはわかるのですが、

@foreach($list as $val)
    <form method="POST" action="/toAddInvoice/{{$val->id}}" id="clients_form">
      {{csrf_field()}}
      <div class="input-field col s12">
        <select id="client_id" class="select" name="client_id" onchange="submit(this.form)">
          <option value="" disabled selected>クライアントを選んでください。</option>
          <option value="{{$val->id}}">{{$val->client_name}}</option>
        </select>
        <label for="client_id">クライアント</label>
      </div>
    </form>
    @endforeach

というコードを書いており、formのactionの中に入っている{{$val->id}}の数値と、<option>のvalueである{{$val->id}}を同一のものにしたいと考えています。

しかし、@foreach〜@endforeachを2つ作り、<form>タグと<option>タグそれぞれを囲うとなると、formのactionの中に入っている{{$val->id}}の数値と、<option>のvalueである{{$val->id}}を同一のものになりません。（具体的には、formのactionの中に入っている{{$val->id}}の数値が1になってしまいます。）

##叶えたいこと
・select boxを1つだけにし、カラムの分だけのoptionができるようにしたい。
・formのactionの中に入っている{{$val->id}}の数値と、<option>のvalueである{{$val->id}}を同一のものにしたい

どのような修正が必要か教えていただきたいです。
よろしくお願いいたします。

##問題のコード
●checkClient.blade.php（一部抜粋）

@foreach($list as $val)
    <form method="POST" action="/toAddInvoice/{{$val->id}}" id="clients_form">
      {{csrf_field()}}
      <div class="input-field col s12">
        <select id="client_id" class="select" name="client_id" onchange="submit(this.form)">
          <option value="" disabled selected>クライアントを選んでください。</option>
          <option value="{{$val->id}}">{{$val->client_name}}</option>
        </select>
        <label for="client_id">クライアント</label>
      </div>
    </form>
    @endforeach

●InvoiceController.php(一部抜粋)

public function checkClient(){
        $list = Client::all();
        return view('invoice.checkClient', compact('list'));
    }

●Client.php（一部抜粋）

public function up()
    {
        Schema::create('clients', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('user_id')->unsigned();
            $table->string('client_name'); //クライアント名
            $table->string('personnel'); //担当者
            $table->string('client_tel_number'); //TEL
            $table->text('client_address'); //住所
            $table->decimal('sales_tax_rate'); //消費税率
            $table->decimal('withholding_tax_rate'); //源泉徴収税率
            $table->integer('tax_category'); //税区分
            $table->integer('fraction'); //端数処理
            $table->timestamps();
                         $table
            ->foreign('user_id')
            ->references('id')
            ->on('users')
            ->onDelete('cascade');
        });

##追記
最終的に以下のようなHTMLができることが理想です。

<form method="POST" action="/toAddInvoice/{{$val->id}}" id="clients_form">
 <div class="input-field col s12">
    <select id="client_id" class="select" name="client_id" onchange="submit(this.form)">
       <option value="" disabled selected>クライアントを選んでください。</option>
       <option value="1">クライアント1</option>
       <option value="2">クライアント2</option>
       <option value="3">クライアント3</option>
    </select>
 <label for="client_id">クライアント</label>
 </div>
</form>

Comments

[m.ts10806]

formを複数作る必要があるのでしょうか

[m.ts10806]

出力結果どのようなHTMLにしたいのか、例示いただけますか？

[m.ts10806]

結局、formを複数作るのかどうかが分からないのですが・・

[HirakuMorishima]

formは1つだけ作りたいと考えています。

[m.ts10806]

では、actionに指定している$val->idは何に利用するために何を入れたいのでしょうか？

Answer 1

option を囲うようにしては？だめでしょうか？

checkClient.blade.php

    <form method="POST" action="/toAddInvoice/{{$val->id}}" id="clients_form">
      {{csrf_field()}}
      <div class="input-field col s12">
        <select id="client_id" class="select" name="client_id" onchange="submit(this.form)">
          <option value="" disabled selected>クライアントを選んでください。</option>
@foreach($list as $val)
          <option value="{{$val->id}}">{{$val->client_name}}</option>
@endforeach
        </select>
        <label for="client_id">クライアント</label>
      </div>
    </form>