将ajax响应对象存储在全局变量中 - 字段丢失

I'm implementing an asynchronous webpage in Grails where I make a call to a controller and render the response as a D3.js network. I stored the object into a global variable for further use. The function worked fine when data is returned. However when I tried to use the object later I found some fields became undefined.

我正在Grails中实现一个异步网页,我调用控制器并将响应呈现为D3.js网络。我将对象存储到全局变量中以供进一步使用。返回数据时,该函数工作正常。但是当我稍后尝试使用该对象时,我发现某些字段未定义。

var similar;

function asynchroNetwork() {
  var jsonData = $.ajax({
    url: "${createLink(controller:'environment', action:'asynchro')}",
    dataType: "json",
    async: true
  }).done(function(jsonData) {

      console.log(jsonData);
      //console.log(jsonText);
      document.getElementById("result").innerHTML="Done";
      console.log(jsonData.all);

      //set global variable
      similar=jsonData;
      console.log("The object got");
      console.log(similar);
      draw();
    });;
}

function draw(){
  console.log(similar);
  //draw the network based on object
}

The controller returns the following JSON:

控制器返回以下JSON:

{
    "\u521B\u4E1A" : {
        "nodes" : [{
                "group" : 1,
                "name" : "\u6c88\u9633\u8f9b\u98962\u4e16"
            }
        ],
        "links" : []
    },
    "all" : {
        "nodes" : [{
                "group" : 1,
                "name" : "qwe25322570"
            }, {
                "group" : 1,
                "name" : "\u660e\u5fb7\u7b03\u884c"
            }, {
                "group" : 1,
                "name" : "\u6c88\u9633\u53ef\u4e50"
            }, {
                "group" : 1,
                "name" : "\u6c88\u9633\u5f6d\u79c0\u8363"
            }, {
                "group" : 1,
                "name" : "\u6c88\u9633\u738b\u632f\u534e"
            }, {
                "group" : 1,
                "name" : "\u6c88\u9633\u8f9b\u98962\u4e16"
            }
        ],
        "links" : [{
                "value" : 1.0,
                "target" : "\u6c88\u9633\u8f9b\u98962\u4e16",
                "source" : "\u660e\u5fb7\u7b03\u884c"
            }, {
                "value" : 1.0,
                "target" : "\u6c88\u9633\u8f9b\u98962\u4e16",
                "source" : "qwe25322570"
            }
        ]
    }
}

In the draw() function it uses similar[all] to draw a graph. But in the links field I see the fields source and target are all undefined, while all fields in the nodes are all fine.

在draw()函数中,它使用类似的[all]来绘制图形。但是在链接字段中,我看到字段source和target都是未定义的,而节点中的所有字段都很好。

I don't think the encoding is the cause because nodes also contains UTF8 characters in the fields but none got missing. After the object is passed back from asychronous function the object similar is okay, but the next time draw() is called, I can see the field links go undefined.

我不认为编码是原因,因为节点在字段中也包含UTF8字符但没有丢失。从异步函数传回对象后,类似的对象是可以的,但是下次调用draw()时,我可以看到字段链接未定义。

Does anyone know what could be the cause of this problem? I guess it maybe related to nested fields.

有谁知道这个问题的原因是什么?我猜它可能与嵌套字段有关。

1 个解决方案

#1

Did you try passing your data as an argument to the draw function? If not, then:

您是否尝试将数据作为参数传递给绘制函数?如果没有,那么:

In your ajax callback:

在你的ajax回调中:

similar = jsonData;
draw(similar) //pass the json

draw function:

function draw(json) {
    console.log(json);
}

#1