Question

I am new to JQuery and Json and I am stumbled into some problem. Appreciate it very much if anyone could offer me some help. My problem is as follow:

In my JSP, I have ajax call that will return me json object. I want to get the keys in my json object, find those tr in my table that its ID match with the the keys, and ultimately populate other column in that particular row with the value from my json object.

Here is my jquery ajax call

    $.ajax({
....
....
success:function(data) {    
//Data is a Json Object. The value is for example :{"A":"1","B":"2","C":"3"}    
for(key in data) {
    $("#myTable tr").find(key).find("td").eq(1).html(data[key]); // not working!
}
}
});

, I have the following html blocks:

<table id = "myTable">
    <tr id = "A">
      <td>Descriptopn.</td>
 <td>...</td> // I want to set this value to be 1
    </tr>

    <tr id = "B">
 <td>Description</td>
 <td>...</td> // I want to set this value to be 2
    </tr>

     <tr id = "C">
  <td>Description</td>
       <td>...</td> // I want to set this value to be 3
</tr>   
 </table> 

My problem is the above syntax is not working. Is there a way I can make this thing right? Thank you.

Answer 1

Since you have the id (and it should be unique!), you can just use the following:-

$('#' + key).find('td:eq(1)').text(data[key]);

Here’s a fiddle