Question: populating arrays with data and grow rendered form dynamically

[phlasserre]

I'm stuck with a very basic question that most of you went through. Here is a schema + form + pre-populated values basicArray.txt (.json file)

and basic HTML code basicForm.txt (.html file)

1) This basic set generates an error while rendering the form, yet does not hang ... (but has side effects?) jsonform.js:3225 Uncaught TypeError: Cannot read properties of undefined (reading 'properties') at formTree. (jsonform.js:3225:35) at underscore.js:73:21 ... Note: even the example https://github.com/jsonform/jsonform/wiki#dealing-with-arrays generates that same error (!)

2) the form is created but does not populate => with no "form" and no "value" section in the json file : the form is created OK, I can programatically populate values for enterprise[0]:{name:...., ....}, not for enterprise[1] => with "form":[......] and no "value" : the form is also created OK, idem as above to populate the form => with both "form":[......], "value":{...} the form does not show up : I get "enterprises" as title, with [+] and [-] buttons, "List of Enterprises as description", but no input fields => the generic question : what piece of code should I insert to grow the rendered form , ready to populate with new array items, when fetched data from server have more items that the form has visible fields

3) my real situation is a bit more complex that this basic example : I have cascaded structures with embedded objets containing arrays => any suggestion welcome.

4) in the script, the "onSubmitValid" and "onSubmit" are never called ... any clue ?

[phlasserre]

on 1. the error comes from my script $('form').jsonForm({ onSubmit:function (errors, values) { ... } }); set of lines eliminated for now, in order to focus on Arrays as core question.

[phlasserre]

on 2. formalism that works is "value": { "enterprises": [ { "name" : "Enterprise-A", "tel" : "+1-1234567890", "email": "contact@enterprise-a.com" }, { "name" : "Enterprise-B", "tel" : "+1-2222222222", "email": "contact@enterprise-b.com" }, { "name" : "Enterprise-C", "tel" : "+1-3333333333", "email": "contact@enterprise-c.com" }, { "name" : "Enterprise-D", "tel" : "+1-4444444444", "email": "contact@enterprise-d.com" } ] }

formalism that does not work : "value": { "enterprises[0]": { "name" : "Enterprise-A", "tel" : "+1-1234567890", "email": "contact@enterprise-a.com" }, "enterprises[1]": { "name" : "Enterprise-B", "tel" : "+1-2222222222", "email": "contact@enterprise-b.com" }, "enterprises[2]": { "name" : "Enterprise-C", "tel" : "+1-3333333333", "email": "contact@enterprise-c.com" }, "enterprises[3]": { "name" : "Enterprise-D", "tel" : "+1-4444444444", "email": "contact@enterprise-d.com" } }

not better... even if this the format I get when submitting values from the form, and format I get from server's database : "value": { "enterprises[0].name" : "Enterprise-A", "enterprises[0].tel" : "+1-1234567890", "enterprises[0].email": "contact@enterprise-a.com", "enterprises[1].name" : "Enterprise-B", "enterprises[1].tel" : "+1-2222222222", "enterprises[1].email": "contact@enterprise-b.com" }

[phlasserre]

point 2. resolved : (1) data received onSubmit are "normalized" before writting in DB on server, (2) data are fetched from server for viewing in form, I append ',"value": + data + '}' at the very end of schema+form this resolves other tiny details envounterd with JQuery to fill the form, fields not found, etc.