繁体   English   中英

如何获取HTML表中的子子值

[英]How to get the sub-child values in HTML tables

我有一个返回以下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
}

我想在HTML表中显示以上数据。 因此,我对其余的服务URL进行了ajax调用,它也随Firebug工具中的数据一起返回。

我无法以html格式打印以上数据。 下面是我的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>

以下是我的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
});

我收到错误,因为类型错误document.getelementbyId为null

任何帮助都感激不尽

谢谢卡西

您要获取的JSON是一个对象,该对象的属性data是一个数组。 在回调中,您引用的对象就像是数据数组一样。 更改代码以引用data.data 例如,您的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>';
}

至于您对document.getElementById的问题,请参见以下问题: 它表示TypeError:document.getElementById(...)为null

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM