Add-on Directory

firebase-fillform - Vaadin Add-on Directory

Automatic Form to fill firebase path firebase-fillform - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/manufosela/firebase-fillform](https://github.com//manufosela/firebase-fillform/blob/1.1.5/README.md) on 2019-05-10 ]** # firebase-fillform [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/manufosela/firebase-fillform) It generate a form based in a firebase path to fill it easyly. Works with an array of objects with a level of deep. The fields can be simple fields or arrays. For example: ```json { "movies" : [ { "classification" : ["science fiction", "adventure" ], "colección" : "Star Wars", "director" : "George Lucas", "formato" : "blue-ray", "titulo" : "The Phantom Menace", "valoracion" : 10 } ] } ``` Is mandatory it exists in the path at least one entry because **The component uses the first entry in the path to get the fields and generate the form.** You can use a firebase path to show a select option in a field. To do this the firebase path must have the same name of the field. For example: ```json { "classification" : [ "science fiction", "adventure", "drama", "comedy", "horror", "psychological thriller", "crime", "romantic", "historical" ], "movies" : [ { "classification" : ["science fiction", "adventure" ], "colección" : "Star Wars", "director" : "George Lucas", "formato" : "blue-ray", "titulo" : "The Phantom Menace", "valoracion" : 10 } ] } ``` Now the *clasification* field it is not a free field, it is shown like a select with the list values. https://github.com/manufosela/firebase-fillform # Dependencies * polymerfire * web-animations-js # Use Put the component in your polymer app. * **path** value of the path to get fields to fill * **api-key** value of the api-key of your firebase database * **domain** value of the domain of your firebase database. **IMPORTANT:** If use 2 or more *firebase-fillform* components in the same page, only define path and api-key in the first component to avoid conflicts and firebase-app object redefinition. Configure Firebase: * Enable google login method authentication * Add a domain if necessary ```html

Basic firebase-fillform demo

Simple

Complex

``` View on GitHub
Online Demo
GitHub Homepage
Issue tracker
License
Documentation

firebase-fillform version 1.0.0
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * https://github.com/PolymerElements/paper-dropdown-menu.git#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0

firebase-fillform version 1.0.1
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * https://github.com/PolymerElements/paper-dropdown-menu.git#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0

firebase-fillform version 1.0.2
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * https://github.com/PolymerElements/paper-dropdown-menu.git#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0

firebase-fillform version 1.1.0
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * polymerelements/paper-dropdown-menu#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0 * polymerelements/paper-item#^2.0.0 * polymerelements/paper-listbox#^2.0.0 * polymerelements/neon-animation#^2.0.1 * polymerelements/paper-dialog-scrollable#^2.1.0 * web-animations/web-animations-js#^2.3.1 * paper-dropdown-menu-multi#^0.2.0

firebase-fillform version 1.1.1
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * polymerelements/paper-dropdown-menu#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0 * polymerelements/paper-item#^2.0.0 * polymerelements/paper-listbox#^2.0.0 * polymerelements/neon-animation#^2.0.1 * polymerelements/paper-dialog-scrollable#^2.1.0 * web-animations/web-animations-js#^2.3.1 * paper-dropdown-menu-multi#^0.2.0

firebase-fillform version 1.1.2
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * polymerelements/paper-dropdown-menu#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0 * polymerelements/paper-item#^2.0.0 * polymerelements/paper-listbox#^2.0.0 * polymerelements/neon-animation#^2.0.1 * polymerelements/paper-dialog-scrollable#^2.1.0 * web-animations/web-animations-js#^2.3.1 * paper-dropdown-menu-multi#^0.2.0

firebase-fillform version 1.1.3
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * polymerelements/paper-dropdown-menu#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0 * polymerelements/paper-item#^2.0.0 * polymerelements/paper-listbox#^2.0.0 * polymerelements/neon-animation#^2.0.1 * polymerelements/paper-dialog-scrollable#^2.1.0 * web-animations/web-animations-js#^2.3.1 * paper-dropdown-menu-multi#^0.2.0

firebase-fillform version 1.1.4
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * polymerelements/paper-dropdown-menu#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0 * polymerelements/paper-item#^2.0.0 * polymerelements/paper-listbox#^2.0.0 * polymerelements/neon-animation#^2.0.1 * polymerelements/paper-dialog-scrollable#^2.1.0 * paper-dropdown-menu-multi#^0.2.0

firebase-fillform version 1.1.5
### Dependencies Polymer/polymer#^2.0.0 * polymerfire#^2.1.0 * paper-button#^2.0.0 * polymerelements/paper-dropdown-menu#^2.0.0 * polymerelements/iron-form#^2.0.0 * polymerelements/paper-input#^2.0.1 * polymerelements/paper-spinner#^2.0.0 * polymerelements/paper-dialog#^2.0.0 * polymerelements/paper-item#^2.0.0 * polymerelements/paper-listbox#^2.0.0 * polymerelements/neon-animation#^2.0.1 * polymerelements/paper-dialog-scrollable#^2.1.0 * paper-dropdown-menu-multi#^0.2.0