簡體   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