Binding nested value of json object to form field

Question

Binding nested value of json object to form field

I am creating a dynamic form for editing data in a json object. First, if something like this exists, let me know. I would prefer not to build it, but I searched the tool many times and found only trees such as structures that require quotation marks. I would be happy to treat all values as strings. This editing functionality is intended for end users, so you just need not to intimidate it.

So far, I have code that generates nested tables to represent a json object. A form field is displayed for each value. I would like to bind the form field to the associated json nested value. If I could store a reference to a json value, I would build an array of links to each value in the json object tree. I have not found a way to do this using javascript.

My last resort approach would be to go through the table after making the changes. I would prefer dynamic updates, but one submit would be better than nothing.

Any ideas?

// the json in files nests only a few levels. Here is the format of a simple case,
{
 "researcherid_id":{
  "id_key":"researcherid_id",
  "description":"Use to retrieve bibliometric data",
  "url_template" :[
    {
      "name": "Author Detail",
      "url": "http://www.researcherid.com/rid/${key}"
    }
  ]         
 }
}

$.get('file.json',make_json_form);

function make_json_form(response) {

   dataset = $.secureEvalJSON(response);
   // iterate through the object and generate form field for string values.

}

// Then after the form is edited I want to display the raw updated json (then I want to save it but that is for another thread)

// now I iterate through the form and construct the json object
// I would rather have the dataset object var updated on focus out after each edit.

function show_json(form_id){
 var r = {};
 var el = document.getElementById(form_id);
 table_to_json(r,el,null);
 $('body').html(formattedJSON(r));
}