基于json数据填充输入字段

Question

我正在尝试根据我的数据生成并填充输入字段。这是我的函数来获取数据：

$.post('url', { ID : ID }, function(data) { 
    alert(data); 
}); 

我提醒数据，看看里面是什么呢，它是这样的：

{ 
    "graphs_name": [{ 
     "ID": "1", 
     "graph_name": "test", 
     "name_x": "x as", 
     "name_y": "y as" 
    }], 
    "graphs_values": [{ 
     "value_x": "10", 
     "value_y": "50" 
    }, { 
     "value_x": "20", 
     "value_y": "100" 
    }, { 
     "value_x": "30", 
     "value_y": "150" 
    }, { 
     "value_x": "40", 
     "value_y": "200" 
    }] 
} 

什么是想要的是一个函数生成输入字段里面他们的价值观，像这样：

是否有一个功能或解决方案做到这一点？我需要它来实现我的更新功能。牛逼 预先感谢您

Answer 1

这里是waardes fiddle动态部分

HTML：

<form> 
    <b>grafieknaam: </b><input type="text" name="grafieknaam"><br> 
    <b>namen van x en y as:</b><br> 
    <table id="waardes"> 
    <tr> 
     <td>x as</td> 
     <td>y as</td> 
    </tr> 
    <tr> 
     <td><input type="text" name="xas"></td> 
     <td><input type="text" name="yas"></td> 
    </tr> 
    <tr> 
    </tr> 
    <tr> 
     <td><b>Waardes x as</b></td> 
     <td><b>Waardes y as</b></td> 
    </tr> 
    </table> 
</form> 

使用这个JS在你的函数$。员额，而不是报警代码：

$("input[name='grafieknaam']").val(post['graphs_name'][0]['graph_name']); 
    $("input[name='xas']").val(post['graphs_name'][0]['name_x']); 
    $("input[name='yas']").val(post['graphs_name'][0]['name_y']); 
    var waardes = $("#waardes"); 
    $.each(post['graphs_values'], function(i,el){ 
     waardes.append("<tr>\ 
      <td><input type='text' name='x" + i + "' value='" + el["value_x"] + "'></td>\ 
      <td><input type='text' name='y" + i + "' value='" + el["value_y"] + "'></td>\ 
     </tr>"); 
    }) 

或根据您发布的结构的一个更多的变体fiddle

Answer 2

//Get graphs_name graphs_values 
console.log(a.graphs_name[0].graph_name); 
console.log(a.graphs_name[0].ID); 
console.log(a.graphs_name[0].name_x); 
console.log(a.graphs_name[0].name_y); 

//graphs_values use as per requirement 
for (i = 0; i < a.graphs_values.length; i++) { 
    console.log(a.graphs_values[i].value_x); 
    console.log(a.graphs_values[i].value_y); 
}