Jsonの出力から各要素のデータを取得します。

Question

Json出力形式で格納された各要素データを取得しようとしています。私は現在、次の

ロード個別にJSONデータ以下に示すように、インターフェイスが見えるJSON出力

function saveFlowchart(){ 
    var node = []; 
    var matches = []; 
    var totalElementCount=0; 
    var searchEles = document.getElementById("container").children; 
    for(var i = 0; i < searchEles.length; i++) 
    { 
     matches.push(searchEles[i]); 
     var idOfEl = searchEles[i].id; 
     totalElementCount=idOfEl; 

     if(searchEles[i].id !=null || searchEles[i].id !="") 
     { 
      var $element = $("#" + searchEles[i].id); 
      var dropElem = $("#" + searchEles[i].id).attr('class'); 

      var position = $element.position(); 

      var elId = parseInt(idOfEl); 

      if (dropElem=="streamdrop ui-draggable") 
      { 
       position.bottom = position.top + $element.height(); 
       position.right = position.left + $element.width(); 

       node.push({ 
        id: idOfEl, 
        class: dropElem, 
        position: 
        { 
         top: position.top, 
         left: position.left, 
         bottom: position.bottom, 
         right: position.right 
        } 
       }); 

       for (var count = 0; count < 100; count++) 
       { 
        if (createdImportStreamArray[count][0] == idOfEl) 
        { 
         node.push({ 
          predefinedStream: createdImportStreamArray[count][1], 

        //...Continued 

var flowChart = {}; 
flowChart.elements =node; 
var flowChartJson = JSON.stringify(flowChart); 
$('#jsonOutput').val(flowChartJson); 
} 

を作成

function loadFlowchart() { 
    var flowChartJson = $('#jsonOutput').val(); 

    var objFromJson = JSON.parse(flowChartJson); 
    var node = objFromJson.node; 
    $.each(node, function (index, element) { 
     var id = element.id; 
     var classes = element.class; 
     var positionTop = element.position.top 
     alert("Id of element parsed: " + id + "\nclass: " + classes 
     + "\npositionTop: " + positionTop); 
    }); 
} 

方法を試してみました。 Loadボタンをクリックすると、コードの最初の部分に示すようにloadFlowChart()メソッドに従って、各要素、クラス、および最上位の位置を警告する必要があります。

しかし、エラーを取得していますし、このエラーにも、私が書かれたが、jQueryのヘルパースクリプトましたスクリプトのいずれかではありません。

Error: Uncaught TypeError: Cannot read property 'length' of undefined

私はJSON出力のノードをループしようとする際に間違ってやっていると、この点で任意のヘルプは高く評価されるかを知っていただきたいと思います。

Answer 1

あなたのコメントによれば、この部分は正しいですが、読んだときにはそうではありません。次の関数で

：

function loadFlowchart() { 
    // Here you get the contents of the input field as text 
    var flowChartJson = $('#jsonOutput').val(); 
    // Here you parse it into a Javascript object 
    var objFromJson = JSON.parse(flowChartJson); 
    // Here you access the "node" attribute of that object, but if I look to the screenshot 
    // you provided there is no "node" attribute in the input field. If that's the case, 
    // then "node" is "undefined" and it would produce the error you indicate. 
    var node = objFromJson.node; 
    // you can verify by showing the full object on the console 
    console.log(objFromJson); 
    // The input field, as seen on the screenshot, would suggest you need to access the 
    // "elements" attribute instead of "node". 
    var node = objFromJson.elements; 
    $.each(node, function (index, element) { 
     var id = element.id; 
     var classes = element.class; 
     var positionTop = element.position.top 
     alert("Id of element parsed: " + id + "\nclass: " + classes 
     + "\npositionTop: " + positionTop); 
    }); 
}