Form

Wraps forms

Form

error

Container for form

The form container allows you to build forms.

<!-- form.blade.php -->
<form id="61efab9a0dd77" class="c-form" data-uid="61efab9a0dd73" method="POST" action="?q=form_component">
    <!-- field.blade.php -->
<label id="label_61efab9a0db7c" class="c-field__text--label" for="input_61efab9a0db7c">Enter text</label>

<div id="61efab9a0db7c" class="c-field c-field__text c-field--md c-field--radius-md">

    
    <input id="input_61efab9a0db7c"
           value=""
           type="text" name="text" aria-labelledby="label_61efab9a0db7c" data-uid="61efab9a0db95"
                      placeholder=""
    />
    <label class="c-field__text--placeholder">
        
    </label>

    <div id="error_input_61efab9a0db7c_message" class="c-field__input-invalid-message">
        <!-- icon.blade.php -->
    <i id="61efab9a0dc5d" class="c-icon c-icon--size-sm material-icons" translate="no" role="img" alt="" data-uid="61efab9a0dc58">
                    error
            </i>
        <span class="errorText"></span>
    </div>
</div>

    <button id="61efab9a0dceb3.63865225" class="c-button c-button__filled c-button__filled--primary c-button--md ripple ripple--before" href="" target="_top" js-toggle-trigger="" js-toggle-item="" type="basic" aria-pressed="false" data-uid="61efab9a0dcfd">   
    <span class="c-button__label">
    
                    <span class="c-button__label-text">
                Submit
            </span>
        
                    
            
    </span>
</button>
</form>
@form([
    'method' => 'POST',
    'action' => '?q=form_component'
])
    @field([
        'type' => 'text',
        'attributeList' => [
            'type' => 'text',
            'name' => 'text',
        ],
        'label' => "Enter text"
    ])
    @endfield

    @button([
        'text' => 'Submit',
        'color' => 'primary',
        'type' => 'basic'
    ])
    @endbutton

@endform

Blade component parameters

Key Default value Type Available values Description
method POST string - Set to POST by default
action # string - Path to file, set to # by default
id string - The DOM id of the component.
classList [] array - Array containing wrapping classes array
attributeList [] array - Array containing keys and values rendered as attributes
containerAware false boolean true/false Makes the component container aware. Appends modifiers --size--xs/sm/md/lg to the component.
Settings location: /mnt/persist/www/docroot_styleguide_v2/source/library/source/php/Component/Form/form.json