如何获取HTML表中的子子值

Question

I have a web-service that returns with the below Json format 我有一个返回以下Json格式的Web服务

{
    "data": [
        {
            "id": 61,
            "fullName": "second,first",
            "firstName": "second",
            "ownerId": 4,
            "emailId": "skmvilla@gmail.com",
            "lastName": "first",
            "isDeleted": "N",
            "smodifyDate": "July2012",
            "statusName": "New",
            "orgId": 20
        },
        {
            "id": 62,
            "fullName": "second,first",
            "firstName": "second",
            "ownerId": 4,
            "emailId": "skmvilla@gmail.com",
            "lastName": "first",
            "isDeleted": "N",
            "smodifyDate": "July2012",
            "statusName": "New",
            "orgId": 20
        }
 ],
    "vprospectMonthlySum": null,
    "vProspectMonthly": null,
    "vProspectCount": null
}

I want the show the above data in a HTML table. 我想在HTML表中显示以上数据。 So i made a ajax call to the rest service URL & also it returns with the data in my firebug tool. 因此，我对其余的服务URL进行了ajax调用，它也随Firebug工具中的数据一起返回。

i was not able to print the above data in a html form. 我无法以html格式打印以上数据。 below is my html code 下面是我的html代码

<html>
       <head>
       <title>Itaxibook</title>

       <h2>Itaxi</h2>   </br>  


           <div class="table" id="tab1"> 

           <table class="basic-table" id="karthi">

           <thead>

           <tr>     
           <td><label >Id</label></td>
           <td align="left"><input type="text" id="id" class="medium" name="" value=""></td>
           </tr>

           <tr>
           <td><label>OrgId</label></td>
           <td align="left"><input type="text" id="orgId" class="medium" name="" value=""></td>
           </tr>               

           <tr>  
           <td><label>FullName</label></td>
           <td align="left"><input type="text" id="fullName" class="medium" name="" value=""></td>
           </tr>

           <tr>
           <td><label >EmailId</label></td>
           <td align="left"><input type="text" id="emailId" class="medium" name="" value=""></td>
           </tr>

           <tr>
           <td><label>ModifyDate</label></td>
           <td align="left"><input type="text" id="smodifyDate" class="medium" name="" value=""></td>
           </tr>



           </thead>

           </table>
 </div>                              





                          </form>

                  </head>                
                </html>
                </html>

Below is my AJAX code 以下是我的AJAX代码

$.ajax({
        type: "GET", //GET or POST or PUT or DELETE verb
        url: "http://88.80.223.163:8080/lumiin-service/lumiin/control/vprospects", // Location of the service
        //contentType: "application/json",
        //data: JSON.stringify(params),
        dataType: "json",
        success: function (data) {//On Successfull service call
            var txtStr = '<table class="datatable"><title="Prospect"><thead><tr> <th>Id</th> <th>OrgId</th> <th>FullName</th> <th>EmailId</th> <th>ModifyDate</th> </tr></thead><tbody></title>';

            for(var i = 0; i < data.length; i++) {
                txtStr += '<tr class="gradeA"> <td><a class="edit_row" href="#tab2" onclick="showDetails(\''+data[i].id+'\');">'+data[i].id+'</a></td> <td>'+data[i].orgId+'</td> <td>'+data[i].fullName+'</td> <td>'+data[i].emailId+'</td> <td>'+data[i].smodifyDate+'</td> </tr>';
            }
            txtStr += '</tbody></table>';
            $("#tab1").html(txtStr);

            document.getElementById('karthi').innerHTML = txtStr;

        },
        error: ServiceFailed// When Service call fails
});

i am getting the error as Type error document.getelementbyId is null 我收到错误，因为类型错误document.getelementbyId为null

Any help will be much appreciated 任何帮助都感激不尽

Thanks Karthie 谢谢卡西

Answer 1

The JSON you are getting back is an object with a property data that is an array. 您要获取的JSON是一个对象，该对象的属性data是一个数组。 In your callback, you are referring to the object as if it is the data array. 在回调中，您引用的对象就像是数据数组一样。 Change your code to refer to data.data . 更改代码以引用data.data 。 For example, your for loop should look like this: 例如，您的for循环应如下所示：

var dataArr = data.data;
for(var i = 0; i < dataArr.length; i++) {
    var datum = dataArr[i];
    txtStr += '<tr class="gradeA"> <td>'+
        '<a class="edit_row" href="#tab2"' +
        'onclick="showDetails(\''+datum.id+
        '\');">'+datum.id+'</a></td> <td>'+
        datum.orgId+'</td> <td>'+datum.fullName+
        '</td> <td>'+datum.emailId+'</td> <td>'+
        datum.smodifyDate+'</td> </tr>';
}

As far as your issue with document.getElementById, see this question: It says that TypeError: document.getElementById(...) is null 至于您对document.getElementById的问题，请参见以下问题：它表示TypeError：document.getElementById（...）为null

如何获取HTML表中的子子值

问题描述

1 个解决方案

解决方案1
0 2013-05-08 14:58:58

如何获取HTML表中的子子值

问题描述

1 个解决方案

解决方案1 0 2013-05-08 14:58:58

解决方案1
0 2013-05-08 14:58:58