Skip to content

Usage

Jump to bottom
Pascal Boucher edited this page Apr 21, 2019 · 38 revisions

Shortcuts

Create a Form - Add Input - Add Select Input - Add Input After - Add Input at Rank - Add Input Before - Get Input - Get All Inputs - Disable All Inputs - Enable All Inputs - Form Request Validation - API Resources - Add HTML Attributes - Remove HTML Attributes

Create a Form

Create a new form and save it in the database.

$form = new \Belvedere\FormMaker\Models\Form\Form();

$form->fill(['name' => $name, 'description' => $description])
    ->method('post')
    ->action('/post_route')
    ->save();

name (string|required): The name of the created form.

description (string|optional): Optional description.

In HTML

<form method="post" action="/post_route">
</form>

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Specifies the form http method.
 *
 * @param string $method
 * @return Form
 */
public function method(string $method): Form

/**
 * Specifies the form url action.
 *
 * @param string $action
 * @return Form
 */
public function action(string $action): Form

Add Input

Add an input of type text to the form with the name of new_input.

$form->add('text', 'new_input')->save();

In HTML

<input type="text" name="new_input">

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Add an input to the parent model.
 *
 * @param string $type
 * @param string|null $name
 * @return Input
 * @throws \Exception
 */
public function add(string $type, ?string $name = null): Input

Add Select Input

Add an input of type select to the form with the name of new_input. The select list has 3 options.

$form->add('select', 'new_input')
    ->withOptions(
        ['title' => 'Cat', 'value' => 'cat'],
        ['title' => 'Dog', 'value' => 'dog'],
        ['title' => 'Bird', 'value' => 'bird']
    )
    ->save();

In HTML

<select name="new_input">
    <option value="cat" title="Cat">Cat</option>
    <option value="dog" title="Dog">Dog</option>
    <option value="bird" title="Bird">Bird</option>
</select>

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Add an input to the parent model.
 *
 * @param string $type
 * @param string|null $name
 * @return Input
 * @throws \Exception
 */
public function add(string $type, ?string $name = null): Input

/**
 * Add options for the select input.
 *
 * @param array ...$options
 * @return Select
 * @throws \Exception
 */
public function withOptions(array ...$options): Select

Add Input After

Add a new input after another one specified by it's name attribute.

$form->addAfter('second_input', 'text', 'new_input')->save();

In HTML

<!-- Before -->
<input type="text" name="first_input">
<input type="text" name="second_input">
<input type="text" name="third_input">

<!-- After -->
<input type="text" name="first_input">
<input type="text" name="second_input">
<input type="text" name="new_input"> <!-- Inserted here. -->
<input type="text" name="third_input">

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Add an input after an other input.
 *
 * @param string $afterInputName
 * @param string $type
 * @param string|null $name
 * @return Input
 * @throws \Exception
 */
public function addAfter(string $afterInputName, string $type, ?string $name = null): Input

Add Input at Rank

Add a new input at a specific rank in the inputs list.

$form->addAtRank(2, 'text', 'new_input')->save();

In HTML

<!-- Before -->
<input type="text" name="first_input">
<input type="text" name="second_input">
<input type="text" name="third_input">

<!-- After -->
<input type="text" name="first_input">
<input type="text" name="new_input"> <!-- Inserted here. -->
<input type="text" name="second_input">
<input type="text" name="third_input">

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Add an input at a specific rank in the ranking.
 *
 * @param int $rank
 * @param string $type
 * @param string|null $name
 * @return Input
 * @throws \Exception
 */
public function addAtRank(int $rank, string $type, ?string $name = null): Input

Add Input Before

Add a new input before another one specified by it's name attribute.

$form->addBefore('second_input', 'text', 'new_input')->save();

In HTML

<!-- Before -->
<input type="text" name="first_input">
<input type="text" name="second_input">
<input type="text" name="third_input">

<!-- After -->
<input type="text" name="first_input">
<input type="text" name="new_input"> <!-- Inserted here. -->
<input type="text" name="second_input">
<input type="text" name="third_input">

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Add an input before an other input.
 *
 * @param string $beforeInputName
 * @param string $type
 * @param string|null $name
 * @return Input
 * @throws \Exception
 */
public function addBefore(string $beforeInputName, string $type, ?string $name = null): Input

Get Input

Get the input with the specified name property.

$form->getInput('new_input');

API

/**
 * Get the input with the specified name property.
 *
 * @param string $name
 * @return Input|null
 * @throws \Exception
 */
public function getInput(string $name): ?Input

Get All Inputs

Get all the inputs associated with the parent model sorted by their position in the ranking. You can optionally filter them by their input type.

$form->inputs(); // all inputs unfiltered 

$form->inputs('text'); // all inputs of type text

API

/**
 * Get the model inputs sorted by their position in the ranking.
 *
 * @param string $type
 * @return \Illuminate\Support\Collection
 * @throws \Exception
 */
public function inputs(string $type = ''): Collection

Disable All Inputs

Disable all the inputs associated with the parent model.

$form->disabled();

In HTML

<!-- Before -->
<input type="text" name="first_input">
<input type="text" name="second_input">
<input type="text" name="third_input">

<!-- After -->
<input type="text" name="first_input" disabled>
<input type="text" name="second_input" disabled>
<input type="text" name="third_input" disabled>

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Disable all inputs.
 *
 * @return void
 * @throws \Exception
 */
public function disabled(): void

Enable All Inputs

Enable all the inputs associated with the parent model.

$form->enabled();

In HTML

<!-- Before -->
<input type="text" name="first_input" disabled>
<input type="text" name="second_input" disabled>
<input type="text" name="third_input" disabled>

<!-- After -->
<input type="text" name="first_input">
<input type="text" name="second_input">
<input type="text" name="third_input">

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Enable all inputs.
 *
 * @return void
 * @throws \Exception
 */
public function enabled(): void

Form Request Validation

Get the rules associated with the form in the array format expected by Laravel.

$form->rules();

API

/**
 * Return the form inputs rules in a form request format.
 *
 * @return array
 * @throws \Exception
 */
public function rules(): array

API Resources

Easily transform all form and inputs model into JSON.

$form->toApi(); // Same has FormResource($form)

$input->toApi(); // Same has InputResource($input)

API

/**
 * Transform the form to JSON.
 *
 * @return \Belvedere\FormMaker\Http\Resources\FormResource
 */
public function toApi(): FormResource

/**
 * Transform the input to JSON.
 *
 * @return \Belvedere\FormMaker\Http\Resources\InputResource
 */
public function toApi(): InputResource

Add HTML Attributes

Easily add HTML attributes to a model. Both Form and Inputs have access to this method.

$form = new \Belvedere\FormMaker\Models\Form\Form();

$form->fill(['name' => 'Test', 'description' => 'Optional description'])
        ->withHtmlAttributes(['charset' => 'utf8', 'role' => 'form'])
        ->method('post')
        ->action('/post_route')
        ->save();

$form->add('text', 'new_input')
        ->withHtmlAttributes(['required' => 'required', 'maxlength' => 10])
        ->save();

In HTML

<form method="post" action="/post_route" accept-charset="utf8" role="form">
    <input type="text" name="new_input" maxlength="10" required="required">
</form>

You are free to implement the view the way you like. The snippet above is just an example.

API

/**
 * Mass assign html attributes to a model.
 *
 * @param array $attributes
 * @return Model
 */
public function withHtmlAttributes(array $attributes): Model

A complete list of all the attributes available can be found here.

Remove HTML Attributes

Easily remove HTML attributes to a model. Both Form and Inputs have access to this method. For the next example, we will start with the form in Add HTML Attributes.

$form->removeHtmlAttributes(['role'])->save();

$form->getInput('new_input')->removeHtmlAttributes(['maxlength'])->save();

In HTML

<!-- Attribute 'role' is removed. -->
<form method="post" action="/post_route" accept-charset="utf8">
    <!-- Attribute 'maxlength' is removed. -->
    <input type="text" name="new_input" required="required">
</form>

You are free to implement the view the way you like. The snippet above is just an example.

Alternative approach

Sometimes it's easier to use one function to cover both add and removal of attributes. Don't worry, Form Maker got you covered. Just pass null in parameter to the attribute you want to remove to achieve the same result.

$form->withHtmlAttributes(['role' => null])->save();

$form->getInput('new_input')->withHtmlAttributes(['maxlength' => null])->save();

API

/**
 * Mass removal of html attributes to a model.
 *
 * @param array $attributes
 * @return Model
 */
public function removeHtmlAttributes(array $attributes): Model
Clone this wiki locally