Form
Form component wrapper with automatic CSRF protection and HTTP method spoofing support
Basic Usage
The most basic form component with POST method by default:
<neura::form action="/submit" method="POST">
<neura::input name="email" type="email" placeholder="Email" />
<neura::button type="submit">Submit</neura::button>
</neura::form>
HTTP Methods
The form component supports all HTTP methods with automatic CSRF handling and method spoofing:
GET Method
POST Method (Default)
PUT Method
PATCH Method
DELETE Method
<!-- GET -->
<neura::form action="/search" method="GET">...</neura::form>
<!-- POST (default) -->
<neura::form action="/users" method="POST">...</neura::form>
<!-- PUT, PATCH, DELETE (with automatic @method) -->
<neura::form action="/users/1" method="PUT">...</neura::form>
<neura::form action="/users/1" method="PATCH">...</neura::form>
<neura::form action="/users/1" method="DELETE">...</neura::form>
Custom Spacing
Customize spacing between form elements with the spacing attribute:
<neura::form action="/submit" spacing="space-y-4">
<!-- Content with custom spacing -->
</neura::form>
Complete Form Example
Complete form example with all elements:
<neura::form action="/users" method="POST">
<neura::input name="name" placeholder="Full Name" />
<neura::input name="email" type="email" placeholder="Email Address" />
<neura::input name="password" type="password" placeholder="Password" />
<neura::button type="submit" class="w-full">Create Account</neura::button>
</neura::form>
Best Practices
✓ Do
- Always specify the action attribute to define the submission URL
- Use the appropriate method (GET for searches, POST for creations, etc.)
- Let the component automatically handle CSRF and method spoofing
- Use the spacing attribute to customize spacing between fields
✗ Don't
- Don't manually add @csrf - it's handled automatically
- Don't manually add @method - it's handled automatically for PUT, PATCH, DELETE
- Don't use POST for actions that don't modify data (use GET)
- Don't forget the action attribute
Properties
| Property | Type | Default | Description |
|---|---|---|---|
| method | string | 'POST' | HTTP method (GET, POST, PUT, PATCH, DELETE). PUT, PATCH, DELETE methods automatically use @method |
| action | string|null | null | Form submission URL |
| spacing | string | 'space-y-6' | CSS classes for spacing between elements (passed via class or spacing attribute) |