Form

Wraps forms

Form

Container for form 

<!-- form.blade.php -->
<form class="c-form js-form-validation" id="673ed3578e4a5" data-uid="673ed3578e4b3" method="POST" action="?q=form_component">

    
    
    <!-- field.blade.php -->
<div class="c-field c-field--text c-field--md c-field--radius-md" id="673ed3578e2bb" data-uid="673ed3578e2d7">
    
            <label class="c-field__label " for="input_673ed3578e2bb" id="label_673ed3578e2bb">
            Enter text
                    </label>
            
    <div class="c-field__inner c-field__inner--text">
        
        
        
        
                    
            
            <input id="input_673ed3578e2bb" value="" aria-labelledby="label_673ed3578e2bb" type="text" name="text" autocomplete="on">
            <div class="c-field_focus-styler u-level-top"></div> 

                    
        
            <!-- icon.blade.php -->
    <span class="c-icon c-field__suffix c-field__error-icon c-icon--error-outline c-icon--material c-icon--material-error_outline material-symbols material-symbols-rounded material-symbols-sharp material-symbols-outlined  c-icon--size-md" aria-hidden="false" material-symbol="error_outline" role="img" data-nosnippet="" translate="no" aria-label="Icon: Undefined" alt="Icon: Undefined" data-uid="673ed3578e3af">
                    </span>

        
            <!-- icon.blade.php -->
    <span class="c-icon c-field__suffix c-field__success-icon c-icon--check-circle-outline c-icon--material c-icon--material-check_circle_outline material-symbols material-symbols-rounded material-symbols-sharp material-symbols-outlined  c-icon--size-md" aria-hidden="false" material-symbol="check_circle_outline" role="img" data-nosnippet="" translate="no" aria-label="Icon: Undefined" alt="Icon: Undefined" data-uid="673ed3578e3fc">
                    </span>

    </div>

    
    </div>

        <button class="c-button c-button__filled c-button__filled--primary c-button--md" target="_top" type="basic" aria-label="Submit" data-uid="673ed3578e45c">   
     <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',
        '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
validation true boolean - Validation method toggle on off
errorMessage string - If filled: Gives a general error message when form is invalid
validateMessage string - If filled: Gives a general success message when form is valid
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: /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Component/Form/form.json