Skip to content

Commit

Permalink
Added OO Builder, Simplified API, Rewrote README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
@geggleto
geggleto committed Sep 14, 2016
1 parent 8d7b620 commit 78a1db4
Show file tree
Hide file tree
Showing 7 changed files with 365 additions and 277 deletions.
269 changes: 19 additions & 250 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# Simple Html Form Builder
# Html Form Builder

This object oriented form builder will allow you to share form objects between different pages in your project.
Ideally via some form of dependency injection.
Expand All @@ -10,260 +10,29 @@ This package hopefully will bring us one step closer to fully interoperable syst

## Usage

For instance in Slim you can do the following.

```php
use Geggleto\Forms\Form;
use Geggleto\Forms\Input;

$container = $app->getContainer();
$container['loginForm'] = function ($c) {
$generator = $c['BootstrapGenerator'];

return $generator->generate([
[
'label' => 'Email',
'type' => 'email',
'id' => 'inputEmail3',
'placeholder' => 'Email'
],
[
'label' => 'Password',
'type' => 'password',
'id' => 'inputPassword3',
'placeholder' => 'Password'
],
], 'Sign In');
};

//Build Dynamic Form
$app->get('/login', function ($req, $res, $args) {
return $res->write($this->loginForm->render());
});

```
$builder = new Builder(new Factory());
$schema = [];
## Real world Usage

### Example Bootstrap Login Form
$schema[] = $builder->getSchemaForColumn('username')
->setPlaceholder('Username');
->setType('text');
```php
use Geggleto\Forms\Button;
use Geggleto\Forms\Div;
use Geggleto\Forms\Form;
use Geggleto\Forms\Input;
use Geggleto\Forms\Label;

$form = (new Form())
->setAttribute('class', 'form-horizontal')
->addChild(
(new Div())
->setAttribute('class', 'form-group')
->addChild(
(new Label())
->setAttribute('for', 'inputEmail3')
->setAttribute('class', 'col-sm-2 control-label')
->setInnerHtml('Email')
)
->addChild(
(new Div())
->setAttribute('class', 'col-sm-10')
->addChild(
(new Input())
->setAttribute('type', 'email')
->setAttribute('class', 'form-control')
->setAttribute('id', 'inputEmail3')
->setAttribute('placeholder', 'Email')
)
)
)->addChild(
(new Div())
->setAttribute('class', 'form-group')
->addChild(
(new Label())
->setAttribute('for', 'inputPassword3')
->setAttribute('class', 'col-sm-2 control-label')
->setInnerHtml('Password')
)
->addChild(
(new Div())
->setAttribute('class', 'col-sm-10')
->addChild(
(new Input())
->setAttribute('type', 'password')
->setAttribute('class', 'form-control')
->setAttribute('id', 'inputPassword3')
->setAttribute('placeholder', 'Password')
)
)
)->addChild(
(new Div())
->setAttribute('class', 'form-group')
->addChild(
(new Div())
->setAttribute('class', 'col-sm-offset-2 col-sm-10')
->addChild(
(new Button())
->setAttribute('type', 'submit')
->setAttribute('class', 'btn btn-default')
->setInnerHtml('Sign in')
)
)
);
```

### Or you can use the Bootstrap Helper!
```php
$form = (new Form())
->setAttribute('class', 'form-horizontal')
->addChild(
$factory->makeFormInput('Email', 'email', 'inputEmail3', 'Email')
)->addChild(
$factory->makeFormInput('Password', 'password', 'inputPassword3', 'Password')
)->addChild(
$factory->makeButton('Sign In')
);
```
$schema[] = $builder->getSchemaForColumn('password')
->setPlaceholder('Password');
->setType('password');
### Now if you wanted to use something like Vue.Js
```php
$form = (new Form())
->setAttribute('class', 'form-horizontal')
->addChild(
$factory->makeFormInput('Email', 'email', 'inputEmail3', 'Email')
->setAttribute('value', '{{ model.email }}');
)->addChild(
$factory->makeFormInput('Confirm Email', 'email', 'inputEmail2', 'Email Again')
->setAttribute('value', '{{ model.email_confirm }}');
)->addChild(
$factory->makeButton('Sign In')
);
```

### Or maybe you want to output the forms to html files.
```php

$factory = new Factory(); //bootstrap factory

$email = $factory->makeFormInput('Email', 'email', 'inputEmail3', 'Email');

//Traverse the Structure to get the Input Element
$email->getChild(1)->getChild(0)->setAttribute('value', '{{ model.email }}');

$form = (new Form())
->setAttribute('class', 'form-horizontal')
->addChild(
$email
)->addChild(
$factory->makeFormInput('Password', 'password', 'inputPassword3', 'Password')
)->addChild(
$factory->makeButton('Sign In')
);


$formHtml = $form->render();
//Write it to disk... could be written to phtml or even twig
```

## Data Binding
It is now possible to bind data to your form.

```php
$form = (new Form())
->setAttribute('class', 'form-horizontal')
->addChild(
$email
)->addChild(
$password
)->addChild(
$factory->makeButton('Sign In')
)->setData([
"email" => 'test@test.com',
"password" => "123456"
$schema[] = $builder->getSchemaForColumn('domain')
->setPlaceholder('Password');
->setType('select')
->setOptions([
"example.com" => 1,
"beta.example.com" => 2,
"theta.example.com" => 3,
]);
```

## Validation

Validation should ultimately be handled by your UI and your API.

## Generators

It is now possible to create forms via an array
```php
$form = (new Form())
->setAttribute('class', 'form-horizontal')
->addChild(
$factory->makeFormInput('Email', 'email', 'inputEmail3', 'Email')
)->addChild(
$factory->makeFormInput('Password', 'password', 'inputPassword3', 'Password')
)->addChild(
$factory->makeFormInput('testSelect', 'select', 'select4', '', [
[
'name' => 'one',
'value' => 1
],
[
'name' => 'two',
'value' => 2
]
])
)
->addChild(
$factory->makeButton('Sign In')
);

$generator = new Generator($factory);
$form2 = $generator->generate([
[
'label' => 'Email',
'type' => 'email',
'id' => 'inputEmail3',
'placeholder' => 'Email'
],
[
'label' => 'Password',
'type' => 'password',
'id' => 'inputPassword3',
'placeholder' => 'Password'
],
[
'label' => 'testSelect',
'type' => 'select',
'id' => 'select4',
'placeholder' => '',
'options' => [
[
'name' => 'one',
'value' => 1
],
[
'name' => 'two',
'value' => 2
],
]
]

], 'Sign In');

```


### Write forms to Local files
`composer persist <input form array> <output file>`

Example:
`composer persist ./tests/array.php ./tests/form.php`

the composer command is an alias for:
`php src/command/persistForm.php`



## Todo
$rootElement = $builder->build($schema, 'Login');
### v1 goals
- [X] Figure out a way to populate select options for the generator
- [X] Add command line composer command to render an array to a file
$builder->write($rootElement, './userLoginForm.php');
```
3 changes: 1 addition & 2 deletions composer.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,6 @@
"test": [
"@phpunit"
],
"phpunit": "phpunit --bootstrap tests/bootstrap.php tests",
"persist" : "php src/command/persistForm.php"
"phpunit": "phpunit --bootstrap tests/bootstrap.php tests"
}
}
Loading

0 comments on commit 78a1db4

Please sign in to comment.