loading... Pacem JS

Nested Entities

Common use-case (or requested feature) relevant to the increasingly popular NoSQL documents/entities and to their front-end UI, is the contextual editing of non-trivial sub-entities either in single instance mode or in a set of instances.
That is a scenario tailored for the PacemChildFormElement.

Here's a child-set of instances example:

[ { "prop": "name" }, { "prop": "children", "type": "array", "validators": [ { "type": "required", "errorMessage": "required" } ], "props": { "display": { "cssClass": ["pacem-grid", "grid-novgap", "grid-tiny-colgap", "grid-nospace"] }, "props": [ { "prop": "name", "display": { "cssClass": ["pacem-cell", "cols-lg-6"] }, "validators": [ { "type": "required", "errorMessage": "required" } ] }, { "prop": "bornWhen", "type": "byte", "display": { "cssClass": ["pacem-cell", "cols-lg-6"] , "name": "born when (age)" } }] } } ]

Here's a single child-instance example:

{ "display": { "cssClass": [ "pacem-grid", "grid-novgap", "grid-tiny-colgap", "grid-nospace" ] }, "props": [ { "prop": "name", "display": { "cssClass": [ "pacem-cell", "cols-lg-6" ] } }, { "prop": "surname", "display": { "cssClass": [ "pacem-cell", "cols-lg-6" ] } }, { "prop": "address", "display": { "cssClass": [ "pacem-cell", "cols-12" ] }, "type": "object", "props": { "display": { "cssClass": [ "pacem-grid", "grid-novgap", "grid-tiny-colgap", "grid-nospace" ] }, "props": [ { "prop": "street", "display": { "cssClass": [ "pacem-cell", "cols-lg-8" ] }, "validators": [ { "type": "required", "errorMessage": "required" } ] }, { "prop": "zip", "display": { "cssClass": [ "pacem-cell", "cols-lg-4" ] } }, { "prop": "city", "display": { "cssClass": [ "pacem-cell" ] }, "validators": [ { "type": "required", "errorMessage": "required" } ] } ] } } ] }