Javascript 使用用户输入更改JSON值

我有一个ipython小部件，其中填充了层次JSON的“name”值。双击时，会出现一个对话框，其中包含已单击的“名称”值。当我点击对话框上的save按钮时，我想用放入框中的内容更新JSON，并将其显示在我的小部件上。我该怎么做

JSON

{
   "name":"",
   "children":[
      {
         "name":"Level 1",
         "children":[
            {
               "name":"Level 2",
               "children":[
                  {
                     "name":"Level 3",
                     "children":[
                        {
                           "name":"Level 4",
                           "children":[
                              {
                                 "name":"Speed",
                                 "children":null,
                                 "id":6
                              }
                           ],
                           "id":5
                        }
                     ],
                     "id":4
                  }
               ],
               "id":3
            }
         ],
         "id":2
      },
      {
         "name":"Level 1",
         "children":[
            {
               "name":"Level 2",
               "children":[
                  {
                     "name":"Level 3",
                     "children":[
                        {
                           "name":"Level 4",
                           "children":[
                              {
                                 "name":"Cost",
                                 "children":null,
                                 "id":11
                              }
                           ],
                           "id":10
                        }
                     ],
                     "id":9
                  }
               ],
               "id":8
            }
         ],
         "id":7
      },
      {
         "name":"Level 1",
         "children":[
            {
               "name":"Level 2",
               "children":[
                  {
                     "name":"Level 3",
                     "children":[
                        {
                           "name":"Level 4",
                           "children":[
                              {
                                 "name":"Manufacturability",
                                 "children":null,
                                 "id":16
                              }
                           ],
                           "id":15
                        }
                     ],
                     "id":14
                  }
               ],
               "id":13
            }
         ],
         "id":12
      }
   ],
   "id":1
}

我目前掌握的代码

var jstring = this.model.get('value') ? this.model.get('value') : "{}";
            var root = JSON.parse(jstring)
            var g = this.g = svg.selectAll("g")
                .data(partition.nodes(root))
                .enter().append("g");
            var path = this.path = g.append("path")
                .attr("d", arc)
                .style("fill", function(d) {
                    d.active = d.active ? true : false
                    return d.active || d.center ? color[1] : color[0];
                })
                .on("click", click)
                .on("dblclick",function(d)
                {

                    var input = document.getElementById("name");
                    input.value = d.name;

                    $( "#dialog" ).dialog(
                    {

                    buttons: {
                        Save: function() {
                        d.name = input.value;

                          $( this ).dialog( "close" );
                        }
                          }

                    });


                })

html

<div id="dialog" title="Edit Text">
  <input type="text" id= "name">
</div>