Datatypes

The type of the input field is based on the data type of each attribute and defaults to a simple text input for empty / null values. The following data types are recognized out of the box:

string

If the value for a field is a string, an input field of type text is rendered (Template-ID: form_string).

boolean

If the value for a field is boolean, a an input field of type checkbox is rendered (Template-ID: form_boolean).

number

If the value for a field is a number, an input field of type number is rendered (Template-ID: form_number).

object

If the value for a field is an object, a selectbox is rendered. You will need to define a source for this type as well. (Template-ID: form_object).

You can customize the templates that are rendered for you fields by providing a template for your field or overwriting the default templates.

Defining a source for objects

Primitive datatypes like strings or boolean values can be easily handeled with the above auto recognition. For more complex types like objects you need to define a source from which the rendered selectbox gets its values. Not all values are submitted on field save but the token of the selected value and values accordingly for multiselect. An example will demonstrate the behaviour.

var form = new ajja.Form("form");
form.load(
    {title: []},
    {save_url: 'message/1',
     title: {
        label: "Title",
        source: [{token: 'mr', title: 'Mr.'},
                 {token: 'mrs', title: 'Mrs.'}]}});

Its also possible to define a multiselect field. Just pass the attribute multiple to the fields options.

var form = new ajja.Form("form");
form.load(
    {title: []},
    {save_url: 'message/1',
     title: {
        label: "Title",
        source: [{token: 'mr', title: 'Mr.'},
                 {token: 'mrs', title: 'Mrs.'}],
        multiple: true}});

If the possible values of a selection depend on the value of another field (subcategories of a category that can be selected from a choice, or a list of search results for a free-text search box), updated source lists can be returned with the server response to the respective save requests, e.g. the requests to save a new supercategory or a new search term. See also the specification of the server protocol. This is a generic way to avoid preloading a huge amount of possible source data (which may not even be possible, as in the search-box example) as well as complex update logic inside client code.

Rendering a Yes/No template for boolean fields

By default, a boolean field is rendered as a checkbox. A selected checkbox represends the value true, a not selected one the value false. By using an object template one can get a boolean field which has two radio buttons for Yes and No (or whatever you want to expess with the field).

var form = new ajja.Form("form"),
    source = [{token: 'true', title: 'Yes'},
              {token: 'false', title: 'No'}];
form.load(
    {sent: 'false'},
    {save_url: 'message/1',
     sent: {
        label: "Was the message sent already?",
        source: source,
        template: 'form_radio_list'}});