Updated Wiki

Signed-off-by: Avior <florian.bouillon@delta-wings.net>
This commit is contained in:
Florian Bouillon 2019-12-02 15:56:53 +01:00
parent 4fc3bb24d1
commit fdf5c9a725
No known key found for this signature in database
GPG Key ID: B143FF27EF555D16

View File

@ -10,18 +10,21 @@ A powerfull Manager for all your forms
- [usage](#usage) - [usage](#usage)
- [Typescript](#typescript) - [Typescript](#typescript)
- [Modules & Attributes](#modules--attributes) - [Modules & Attributes](#modules--attributes)
- [Modules](#modules) - [Builtin Modules](#builtin-modules)
- [Attributes](#attributes) - [Builtin Attributes](#builtin-attributes)
- [Issues](#issues) - [Issues](#issues)
- [Changelog](#changelog) - [Changelog](#changelog)
- [Wiki](#wiki)
## Installation ## Installation
nothing difficult nothing difficult.
In you project simply run this command
```bash ```bash
yarn add @dzeio/form-manager yarn add @dzeio/form-manager
```
or or
```bash
npm install @dzeio/form-manager npm install @dzeio/form-manager
``` ```
@ -32,73 +35,81 @@ npm install @dzeio/form-manager
```ts ```ts
import FormManager from '@dzeio/form-manager'; import FormManager from '@dzeio/form-manager';
const fm = new FormManager(docuement.getElementById("form")); const fm = new FormManager(document.getElementById("form"));
const am = fm.attributeManager; // The Attribute Manager
```
// add modules Add Modules
import { FMRepeatAssignment } from '@dzeio/FormManager/modules/FMRepeatInput' ```ts
import RepeatInput from '@dzeio/form-manager/modules/RepeatInput'
import IgnoreAttribute from '@dzeio/form-manager/attributes/IgnoreAttribute';
fm.assign(FMRepeatAssignment) fm.assign(RepeatInput)
// and/or attributes
am.register(IgnoreAttribute)
// or // After adding modules/attributes run to reffect modules to inputs
import FMDateInput from '../FormManagerGit/modules/FMDateInput'
fm.assign({
input: FMDateInput,
type: "date",
tagName: "input"
});
// After adding modules run to reffect modules to inputs
fm.setupInputs(); fm.setupInputs();
am.setup();
```
// verify form validity: Now You can launch any lines from below !
```ts
import { FMMode } from '@dzeio/form-manager'
// verify form validity
fm.verify(); //return true if valid else return false fm.verify(); //return true if valid else return false
// if it returns false you can use the variable under to see th FMInput that isnt valid // if it returns false you can use the variable under to see the first errored input
fm.lastErroredInput fm.lastErroredInput
// submit your data to an endpoint // submit your data to an endpoint
fm.submit("/api/idk", (ev) => {/* onloaded callback*/}, /* verify datas beforehand default:true*/ true) fm.submit("/api/dzeio", (ev) => {/* onloaded callback*/})
// get the json of your form // get the json of your form
fm.getJSON() fm.getJSON()
// fill form from URI (datas MUST be in JSON (see getJSON for examples)) // fill form from URI
// datas MUST be in JSON (see getJSON for examples)
fm.fillFromURI("uri") fm.fillFromURI("uri")
// same as before but you give the json from ts // same as before but you give the json from typescript
fm.fillFromJSON(json) fm.fillFromJSON(json)
// change if you only see the form or edit them // change if you only see the form or edit them
fm.setMode(FMMode.ViewMode or FMMode.EditMode) fm.setMode(FMMode.ViewMode) // make form uneditable
fm.setMode(FMMode.EditMode) // Make form editable
// same thing as before but just for one field // same thing as before but just for one field
fm.setModeForInput(FMMode.ViewMode or FMMode.EditMode, "inputName") fm.setModeForInput(FMMode.ViewMode, "inputName")
fm.setModeForInput(FMMode.EditMode, "inputName")
// Reset the form to it's defaults values // Reset the form to it's defaults values
fm.clear() fm.clear()
``` ```
## Modules & Attributes ## Modules & Attributes
### Modules You can create you own modules/attributes or use the builtin ones
See [AbstractInput.ts](https://git.delta-wings.net/dzeio/FormManager/src/branch/master/src/modules/InputAbstract.ts) to get started on module creation
And [AbstractAttribute.ts](https://git.delta-wings.net/dzeio/FormManager/src/branch/master/src/attributes/AttributeAbstract.ts) for attribute creation
### Builtin Modules
| Module name | Description | | Module name | Description |
| :---------: | :---------: | | :---------: | :---------: |
| [Datalist](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.datalist) | Manage the datalist better than ever ! | | [Datalist](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.datalist) | Manage the datalist better than ever ! |
| [Date](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.date) | Manage the date element | | [Date](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.date) | Manage the date element |
| [File](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.file) | Manage single file uploads |
| [Repeat](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.repeat) | Make your fields repeatable ! | | [Repeat](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.repeat) | Make your fields repeatable ! |
| [Select](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.select) | Fix your Select | | [Select](https://git.delta-wings.net/dzeio/FormManager/wiki/modules.select) | Fix your Select |
### Attributes ### Builtin Attributes
| Attribute name | Description | | Attribute name | Description |
| :------------: | :---------: | | :------------: | :---------: |
| [data-autoset](https://git.delta-wings.net/dzeio/FormManager/wiki/attribute.data-autoset) | Update your value in _near_ realtime | | [data-autoset](https://git.delta-wings.net/dzeio/FormManager/wiki/attributes.data-autoset) | Update your value in realtime |
| [data-default](https://git.delta-wings.net/dzeio/FormManager/wiki/attribute.data-default) | a better value than `value` | | [data-default](https://git.delta-wings.net/dzeio/FormManager/wiki/attributes.data-default) | a better value than `value` |
| [data-ignore](https://git.delta-wings.net/dzeio/FormManager/wiki/attribute.data-ignore) | i don't see this | | [data-ignore](https://git.delta-wings.net/dzeio/FormManager/wiki/attributes.data-ignore) | make an input field not submitted |
| [data-regex](https://git.delta-wings.net/dzeio/FormManager/wiki/attribute.data-regex) | regex your value | | [data-regex](https://git.delta-wings.net/dzeio/FormManager/wiki/attributes.data-regex) | Verify you value via regex |
## Issues ## Issues
@ -106,4 +117,8 @@ Complete listing [here](https://git.delta-wings.net/dzeio/FormManager/issues)
## Changelog ## Changelog
[here](./CHANGELOG.md) [Here](./CHANGELOG.md)
## Wiki
[Here](#form-manager)