, (*1)
Foundation Laravel (Laravel4 Package)
tl;dr
Build HTML form elements for Foundation inside Laravel 4, including validation error handling. Documentation for the respective frameworks can be found at Foundation website and Laravel website., (*2)
Required setup
In the require
key of composer.json
file add the following, (*3)
"stevenmaguire/zurb-foundation-laravel": "dev-master"
Run the Composer update comand, (*4)
$ composer update
In your config/app.php
add 'Stevenmaguire\Foundation\FoundationServiceProvider'
to the end of the $providers
array, (*5)
'providers' => array(
'Illuminate\Foundation\Providers\ArtisanServiceProvider',
'Illuminate\Auth\AuthServiceProvider',
...
'Stevenmaguire\Foundation\FoundationServiceProvider',
),
Usage
When composing forms using the blade view engine within Laravel 4, this package will intercept basic Form::method requests and compose form elements that are structured for use in a Foundation 4 based presentation., (*6)
<div class="large-8 small-12 columns">
{{ Form::model($user,array('route' => 'route.name','class' => 'custom')) }}
<fieldset>
<legend>Create New Account</legend>
{{ Form::label('name', 'Full Name') }}
{{ Form::text('name',$user->name,array('placeholder'=>'Tell us your whole name')) }}
{{ Form::label('email', 'Email') }}
{{ Form::text('email',$user->email,array('placeholder'=>'Valid email used to login and receive information from us')) }}
{{ Form::label('password', 'Password') }}
{{ Form::password('password',$user->password,array('placeholder'=>'Gimme your password')) }}
{{ Form::submit('Create Account',array('class'=>'button')) }}
</fieldset>
{{ Form::close() }}
</div>
will render without errors, (*7)
<div class="large-8 small-12 columns">
<form accept-charset="UTF-8" action="http://host/action/from/route" class="custom" method="post">
<fieldset>
<legend>Create New Account</legend>
<label for="name">Full Name</label>
<input id="name" name="name" placeholder="Tell us your whole name" type="text">
<label for="email">Email</label>
<input id="email" name="email" placeholder="Valid email used to login and receive information from us" type="text">
<label for="password">Password</label>
<input id="password" name="password" placeholder="Gimme your password" type="password" value="">
<input class="button" type="submit" value="Create Account">
</fieldset>
</form>
</div>
and with errors, (*8)
$rules = array(
'name' => array('required','min:3','max:32','regex:/^[a-z ,.\'-]+$/i'),
'email' => array('required','unique:users,email,%%id%%','regex:/^([a-zA-Z0-9])+([a-zA-Z0-9\+\%\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/'),
'password' => array('required')
);
<div class="large-8 small-12 columns">
<form accept-charset="UTF-8" action="http://host/action/from/route" class="custom" method="post">
<fieldset>
<legend>Create New Account</legend>
<label class="error" for="name">Full Name</label>
<input class="error" id="name" name="name" placeholder="Tell us your whole name" type="text" value="">
<small class="error">The name field is required.</small>
<label class="error" for="email">Email</label>
<input class="error" id="email" name="email" placeholder="Valid email used to login and receive information from us" type="text" value="">
<small class="error">The email field is required.</small>
<label class="error" for="password">Password</label>
<input class="error" id="password" name="password" placeholder="Gimme your password" type="password" value="">
<small class="error">The password field is required.</small>
<input class="button" type="submit" value="Create Account">
</fieldset>
</form>
</div>
Currently supported methods
- text
- password
- email
- textarea
- select
- selectRange
- selectMonth
- label