Milk Admin
Quick Form Creation with FormBuilder

This is a manual, artisanal system for form validation. If you need to create forms quickly from your Models, we recommend using the FormBuilder which can generate complete forms with validation in minutes:

→ Getting Started - Forms with FormBuilder

Validation

The system follows the Bootstrap standard for form validation.

Please enter a message in the textarea.
Example invalid feedback text
Please select a value
Please select a value
Please upload a file
<form class="was-validated">
        <div class="mb-3">
        <?php Form::textarea('myValidTextarea', 'Label', '', 4, ['required'=>true, 'invalid-feedback'=>'Please enter a message in the textarea.']); ?>
        </div>
        <?php 
        Form::checkboxes('myValidCheckboxes', ['1' => 'Check this checkbox'], '', false, ['invalid-feedback'=>'Example invalid feedback text', 'form-group-class'=>'mb-3'],['required'=>true]);
        Form::radios('myValidRadios', ['1' => 'Toggle this radio', '2' => 'Or toggle this other radio'],  '', false, ['label'=>'Select fields', 'invalid-feedback'=>'Please select a value', 'form-group-class'=>'mb-3'],['required'=>true]); 
        ?>
        <div class="mb-3">
        <?php Form::select('mySelect', 'Label', [''=>'Open this select menu', '1' => 'One', '2' => 'Two', '3' => 'Three'], '', ['required'=>true, 'floating'=>true, 'invalid-feedback'=>Please select a value']); ?>
        </div>
        <div class="mb-3">
        <?php Form::input('file', 'file', '', '', ['required'=>true, 'invalid-feedback'=>'Example invalid form file feedback']); ?>
        </div>
        <div class="mb-3">
        <button class="btn btn-primary" type="submit" disabled>Submit form</button>
        </div>
    </form>
    


Custom JavaScript Validation

The framework automatically handles form validation. You can add custom validation logic by listening to specific JavaScript events.

Available Events

Event When Usage
fieldValidation On submit, and in real-time after first submit attempt Add custom validation for specific fields
customValidation On submit, before checking validity Form-level validation involving multiple fields
beforeFormSubmit After validation passes, before actual submit Perform actions before submission (e.g., show loading)

Example: Field Validation with Regex

Validate a phone number field using a regular expression:

document.addEventListener('DOMContentLoaded', function() {
    const phoneField = document.querySelector('[name="phone"]')

    if (phoneField) {
        phoneField.addEventListener('fieldValidation', function(e) {
            const field = e.detail.field
            const phoneRegex = /^[0-9]{10}$/

            if (!phoneRegex.test(field.value)) {
                field.setCustomValidity('Phone must be 10 digits')
            } else {
                field.setCustomValidity('')
            }
        })
    }
})

Example: Form-Level Validation

Validate multiple fields together:

document.addEventListener('DOMContentLoaded', function() {
    const myForm = document.querySelector('#myForm')

    if (myForm) {
        myForm.addEventListener('customValidation', function(e) {
            const form = e.detail.form
            const startDate = form.querySelector('[name="start_date"]').value
            const endDate = form.querySelector('[name="end_date"]').value

            if (new Date(startDate) > new Date(endDate)) {
                alert('End date must be after start date')
                e.preventDefault()
                return false
            }
        })
    }
})


Invalid form via PHP

If the form is submitted, but some fields are wrong and an alert with error messages must be shown, you can use the MessagesHandler class.

Please enter a test name.
<?php
        MessagesHandler::addError('This is a test name error message', 'test-name');
        echo MessagesHandler::getErrorAlert(); 
    ?>

    <div class="bg-light p-2">
        <div class="form-group col-xl-6">
            <?php Form::input('text', 'test-name', 'Name', '', ['id'=>'my-custom-test-name-id', 'invalid-feedback'=>'Please enter a test name.']); ?>
        </div>
    </div>

From PHP you may want to specify which fields were not validated during form submission through the MessagesHandler class.

The functions are:

MessagesHandler::addError($msg, $field);

Adds an error message for a field

MessagesHandler::addFieldError($field);

Adds a field as invalid

MessagesHandler::getErrorAlert($field_name);

Returns an alert with error messages



Related Documentation

Loading...