search

gitana / alpaca

Alpaca provides the easiest way to generate interactive HTML5 forms for web and mobile applications. It uses JSON Schema and simple Handlebars templates to generate great looking, dynamic user interfaces on top of Twitter Bootstrap, jQuery UI, jQuery Mobile and HTML5.
http://www.alpacajs.org
Other
1.29k stars 371 forks source link

What is the best way to create composite fields? #644

Closed thesame closed 2 years ago

thesame commented 6 years ago

I need to create a field that consists of multiple inputs. For example, I need a key-value pair where Key is Select input built with dynamically generated values and Value input is just a text input. Key and Value inputs should stack horizontally (in terms of bootstrap forms) with arbitrary content between them (for example, nice equality sign or arrow picture). I see two ways to achieve this:

  1. Create a custom field for it. In this case, how could I build Key field with dynamically populated values?
  2. Add Key and Value to my schema. In this case, how could I control the form layout?
ambischof commented 6 years ago

I have encountered a similar case myself. What I did was create a custom field extending an object field, overriding the setValue, getValue, setup and a few other things. (For me I wanted a select field with an 'other' option, and when that was selected, another text field popped up).

You don't necessarily need a custom field though, its a bit of a learning curve. I'd try to start by making the field with an object, override the object template and then when you get the form data, parse it into whatever you needed.