View on GitLab

Enclose

"Enclose" is a peculiar type of element provided by Larastrap: similar to a Form, it acts as a logical container for other elements without providing any actual HTML markup.

@php
$obj = App\Models\User::inRandomOrder()->first();
@endphp

<x-larastrap::enclose :obj="$obj">
    <x-larastrap::text name="name" readonly squeeze />
    <x-larastrap::email name="email" squeeze />
</x-larastrap::enclose>
<input id="input-0c5a900aa3a66947342cc44dcd1d4708" type="text" class="form-control-plaintext" name="name" value="Miss Earnestine Lowe" readonly> <input id="input-f396b51040d70ae73d3203d5b94ab551" type="email" class="form-control" name="email" value="langosh.rosalyn@example.com">

His may purpose is to isolate different models within the same logical block. The common use case is: a form with a table involving multiple models at once, each with his own attributes (and his own input fields).

<x-larastrap::form>
    <table class="table">
        @foreach(App\Models\User::inRandomOrder()->take(3)->get() as $user)
            <x-larastrap::enclose :obj="$user">
                <tr>
                    <td><x-larastrap::text name="name" readonly squeeze="true" /></td>
                    <td><x-larastrap::email name="email" npostfix="[]" squeeze="true" /></td>
                </tr>
            </x-larastrap::enclose>
        @endforeach
    </table>
</x-larastrap::form>
<form id="form-45c48cce2e2d7fbdea1afc51c7c6ad26" class="" method="post" name="form-45c48cce2e2d7fbdea1afc51c7c6ad26">
  <input type="hidden" name="_token" value="LI8f7XZsWSa0z7asuMEO3Tv3HHIjorLGEVh30A3b" autocomplete="off">
  <table class="table">
    <tr>
      <td>
        <input id="input-a95325bf77c518ab711c9e728cb0b803" type="text" class="form-control-plaintext" name="name" value="Prof. Ethan Schmitt III" readonly>
      </td>
      <td>
        <input id="input-ef5c803d8578b413b49a831000b30f46" type="email" class="form-control" name="email[]" value="ashly77@example.org">
      </td>
    </tr>
    <tr>
      <td>
        <input id="input-6837c0f093a6a04d2a922de7d856bc8b" type="text" class="form-control-plaintext" name="name" value="Dr. Darrin Hamill" readonly>
      </td>
      <td>
        <input id="input-5d298da01d369a167261d9ab16ef9330" type="email" class="form-control" name="email[]" value="lincoln.davis@example.net">
      </td>
    </tr>
    <tr>
      <td>
        <input id="input-cde9978a93ba8338b7a1bea552031d6c" type="text" class="form-control-plaintext" name="name" value="Carolyne Bradtke" readonly>
      </td>
      <td>
        <input id="input-8885e42cc74c2a04a31ebc653f0c4507" type="email" class="form-control" name="email[]" value="wisoky.dax@example.org">
      </td>
    </tr>
  </table>
  <div class="col-12 text-end">
    <button id="button-bcdda4155123fe7edf1498a86d0160de" class="btn btn-primary" type="submit">Save</button>
  </div>
</form>

In the example above, it is important to note the use of npostfix parameter: when the form is submitted, all email addresses have to be serialized into an array and sent to the specified endpoint (the form's action ).