FastForm
FastForm allows you to create and validate complex forms in mere seconds. It was designed so you can build a form/validation set, and then reuse it over and over again, which enables you to drop a form - no matter how large - into your project in only seconds. This is accomplished by creating your FastForm with arrays, and then passing the name of the form into the fastform()
and fastpost()
methods.
Let's check out how you would display one of Formr's default FastForms: login
.
Displaying the login FastForm
$form->fastform('login');
Produces the following HTML
<form action="/index.php" id="login" method="post" accept-charset="utf-8">
<fieldset>
<div class="div">
<input type="text" name="username" id="username" class="input" placeholder="username">
</div>
<div class="div">
<input type="password" name="password" id="password" class="input" autocorrect="off" autocapitalize="off" placeholder="password">
</div>
<input type="submit" name="submit" value="Login" id="submit" class="button">
</fieldset>
</form>
And here's how to retrieve and validate the form's values, and assign them to variables.
Validating the login FastForm
if($form->submitted())
{
$data = $form->fastpost('login');
$username = $data['username'];
$password = $data['password'];
}
Let's Build a FastForm
Before we can start passing strings to the fastform()
method, we need to understand how FastForms are built.
Creating a FastForm is really easy: just create an array and fill it with field element types as the key, and element attributes as the value. The attribute values follow the same rules as the post()
method. We can then pass the array directly to the fastform()
method.
Building a FastForm Form Array
$array = [
'text' => 'name,Name,John Wick',
'email' => 'email,Email,johnwick@gunfu.com',
'textarea' => 'comments,Comments'
];
$form->fastform($array);
Produces the following HTML
<form action="/index.php" id="" method="post" accept-charset="utf-8">
<fieldset>
<div class="div">
<label for="">Name</label>
<input type="text" name="name" value="John Wick" id="name" class="input">
</div>
<div class="div">
<label for="">Email</label>
<input type="email" name="email" value="johnwick@gunfu.com" id="email" class="input">
</div>
<div class="div">
<label for="">Comments</label>
<textarea name="comments" id="comments" class="input" ></textarea>
</div>
<input type="submit" name="submit" value="Submit" id="submit" class="button">
</fieldset>
</form>
Array Keys Must Be Unique
Each key must be uniquely named or the fields will overwrite each other. You can name the keys anything you like, as long as the field's input type is written first. See the following example.
A More Complex FastForm Form Array
$data = [
'text' => 'fname,First name:,,fname',
'text2' => 'lname,Last name:,,lname',
'email' => 'email,Email:,,email',
'text3' => 'city,City:,,city',
'select' => 'state,State:,,state,,,,state',
'text4' => 'zip,Zip/Postal Code:,,zip',
'select2' => 'country,Country:,,country,,,US,country',
'label' => 'sex,What sex are you?',
'radioM' => 'sex,Male,male,male',
'radioF' => 'sex,Female,female,female',
'textarea' => 'comments,Comments:,,comments'
];
$form->fastform($data);
<form action="/index.php" method="post" accept-charset="utf-8">
<fieldset>
<div id="_fname" class="form-group">
<label class=control-label for="fname">First name:</label>
<input type="text" name="fname" id="fname" class="form-control">
</div>
<div id="_lname" class="form-group">
<label class=control-label for="lname">Last name:</label>
<input type="text" name="lname" id="lname" class="form-control">
</div>
<div id="_email" class="form-group">
<label class=control-label for="email">Email:</label>
<input type="email" name="email" id="email" autocorrect="off" autocapitalize="off" class="form-control">
</div>
<div id="_city" class="form-group">
<label class=control-label for="city">City:</label>
<input type="text" name="city" id="city" class="form-control">
</div>
<div id="_state" class="form-group">
<label class=control-label for="state">State:</label>
<select name="state" id="state" class="form-control">
<option value="" selected="selected">Select a State...</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
...
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</div>
<div id="_zip" class="form-group">
<label class=control-label for="zip">Zip/Postal Code:</label>
<input type="text" name="zip" id="zip" class="form-control">
</div>
<div id="_country" class="form-group">
<label class=control-label for="country">Country:</label>
<select name="country" id="country" class="form-control">
<option value="">Select a Country...</option>
<option value="US" selected="selected">United States </option>
<option value="CA">Canada</option>
<option value="GB">United Kingdom</option>
<option value=" ">---------------</option>
<option value="AF">Afghanistan </option>
<option value="AL">Albania </option>
...
<option value="ZM">Zambia</option>
<option value="ZW">Zimbabwe</option>
</select>
</div>
<label for="sex">What sex are you?</label>
<div id="_sex" class="radio">
<label for="male"><input type="radio" name="sex" value="male" id="male">Male</label>
</div>
<div id="_sex" class="radio">
<label for="female"><input type="radio" name="sex" value="female" id="female">Female</label>
</div>
<div id="_comments" class="form-group">
<label class=control-label for="comments">Comments:</label>
<textarea name="comments" id="comments" class="form-control"></textarea>
</div>
<div id="_submit" class="form-group">
<input type="submit" name="submit" value="Submit" id="submit" class="btn">
</div>
</fieldset>
</form>
Info
Notice how we specified our state and country drop-downs by using the strings state
and country
in the eighth paramater instead of creating and adding an array full of options? Adding a string instead of an array tells Formr to look for that drop-down menu in the Dropdowns
class, which is located at lib/class.formr.dropdowns.php
. You can also add your own custom dropdowns by extending Formr.
Tip
If you need to use a comma in a string, just enter its ASCII or HTML equivalent ,
.
Multidimensional Arrays
As you saw in the previous example, you can add radios, checkboxes and drop-downs using strings. While this is incredibly fast, it’s also somewhat limited, so FastForm will allow you to build your forms with multidimensional arrays as well.
Building with Multidimensional Arrays
// build an array with our t-shirt sizes...
$shirts = [
'large' => 'Large',
'medium' => 'Medium',
'small' => 'Small'
];
// now we build our drop-down menu and add the t-shirt array as our list of options
$data = [
'select' => [
'name'=> 'shirts',
'label'=> 'Shirts:',
'options'=> $shirts,
'selected'=> 'small'
]
];
$form->fastform($data);
Produces the following HTML (with Bootstrap as our Wrapper)
<form action="/index.php" method="post" accept-charset="utf-8">
<fieldset>
<div id="_shirts" class="form-group">
<label class=control-label for="shirts">Shirts:</label>
<select name="shirts" id="shirts" class="form-control">
<option value="large">Large</option>
<option value="medium">Medium</option>
<option value="small" selected="selected">Small</option>
</select>
</div>
<div id="_submit" class="form-group">
<input name="submit" type="submit" id="submit" value="Submit" class="btn">
</div>
</fieldset>
</form>
Radio Groups & Checkbox Arrays
You can build a checkbox array or radio group by adding a label and as many elements as you like, however, there is an easier way: just put all of your element names in the array's value
parameter, separate them with a pipe and wrap them with square brackets.
Easy Radio Groups
$data = [
'radio' => 'food,Favorite food:,[steak|chicken|fish],food'
];
$form->fastform($data);
Produces the following HTML (with Bootstrap as our Wrapper)
<form action="/index.php" method="post" accept-charset="utf-8">
<fieldset>
<div id="_food" class="form-group">
<label class="control-label">Favorite food:</label>
<div class="radio">
<label for="steak">
<input type="radio" name="food" value="steak" id="steak">Steak
</label>
</div>
<div class="radio">
<label for="chicken">
<input type="radio" name="food" value="chicken" id="chicken">Chicken
</label>
</div>
<div class="radio">
<label for="fish">
<input type="radio" name="food" value="fish" id="fish">Fish
</label>
</div>
</div>
<div id="_submit" class="form-group">
<input type="submit" name="submit" value="Submit" id="submit" class="btn">
</div>
</fieldset>
</form>
Easy Checkbox Arrays
$data = [
'checkbox' => 'genres[],Favorite genres:,[rock|funk|rap],genres'
];
Warning
Since radio elements are usually grouped, a "required field" indicator such as an asterisk *
will not be placed next to a required field for each radio element in that group. Adding a <label>
for the group (as in the previous example) will give you an *
indicating that the entire group is required.
Fieldsets
Building fieldsets in FastForm is a piece of cake! Simply create an array for each fieldset, assign the legend text, and add your form fields to the fields
array.
Example
$data = [
'fieldset1' => [
'legend' => 'Name & Email',
'fields' => [
'text' => 'name,Name',
'email' => 'email,Email',
],
],
'fieldset2' => [
'legend' => 'Address',
'fields' => [
'text2' => 'address,Address',
'text3' => 'city,City',
'select' => 'state,State,,,,,,states',
'number' => 'zip,Zip',
],
],
'number2' => 'phone,Phone',
'textarea' => 'comments,Comments'
];
Retrieving The Form Values
FastForm wasn't designed to only create forms, it was also designed to validate them just as easily using the fastpost()
method.
Example
$form->pastpost('login');
You build the validation the same as you build the form: with arrays.
Example
$rules = [
'username' => ['Username', 'required|min[3]|max[16]|slug'],
'password' => ['Password', 'required|hash']
];
$data = $form->fastpost($rules);
Putting it All Together
Now that you know how to build the forms and validation sets, let's see how we can put them together and make your own FastForm!
-
Head over to the Formr Extend repo and install the
my_classes
folder into yourFormr
folder. -
Open
my_classes/my.forms.php
and take a look at themy_login
method. This is basically what we used earlier, but now it's in our own personal plugin class. -
Go to your form page and create a new FastForm, then drop in the
fastform()
andfastpost()
methods with our newly available custom FastForm.
Using the my_login FastForm
<!DOCTYPE html>
<body>
<?php
$form = new Formr();
if($form->submitted())
{
// validate the $_POST data
$post = $form->fastpost('my_login');
$username = $post['username'];
$password = $post['password'];
}
// print the form
$form->fastform('my_login');
?>
</body>
</html>
And for the Truly Lazy…
There’s fastpost('POST')
. Using FastForm in this manner will return an array of the key/value pairs from the $_POST
array, plus perform some basic validation based upon the field names. For instance, if the field name is email
Formr will automatically run the valid_email
validation rule on it. The list of validation rules can be found in the Validation docs.
Just Grab Everything From $_POST
// puts all of our POST key/values into an array named $post
$post = $form->fastpost('POST');
// then just create variables based upon your form's field names
$fname = $post['fname'];
$lname = $post['lname'];