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

Name Property Doesn't Work On Nested Fields #668

Open dstanley1994 opened 5 years ago

dstanley1994 commented 5 years ago

If I nest a field inside another, the name property doesn't seem to work. For example,

{
  "data":{
    "idnum":""
  },
  "schema":{
    "type":"object",
    "title":"Identifier",
    "properties":{
      "idnum":{
        "title":"ID Number",
        "type":"string"
      }
    }
  },
  "options":{
    "fields":{
      "idnum":{
        "label":"ID Number",
        "name":"id_number",
      }
    }
  }
}

This code properly gives the name id_number to the field I've created. But the following doesn't:

{
  "data":{
    "Identification":{
      "idnum":""
    }
  },
  "schema":{
    "type":"object",
    "properties":{
      "Identification":{
        "type":"object",
        "title":"Identification",
        "properties":{
          "idnum":{
            "title":"ID Number",
            "type":"string"
          }
        }
      }
    }
  },
  "options":{
    "fields":{
      "idnum":{
        "label":"ID Number",
        "name":"id_number"
      }
    }
  }
}

Instead the field gets assigned the name Identification_idnum and I have no way to change it.

BrianH85 commented 5 years ago

Hi dstanley,

I think the following code should work for you. You need to define the options at the same level as your schema, so since you have an object nested inside another object you need to reflect this in your options as well. Like this:

"options": {
    "fields": {
        "Identification": {
            "fields": {
                "idnum": {
                    "label": "ID Number",
                    "name": "id_number"
                }
            }
        }
    }
}