javascript - 如何使用 jquery 在单击的行下方添加新行

Question

点击第二列点击我正在调用下面的方法

function getListOfList(primaryId, isFlat, col) {
        alert(primaryId)
        $.ajax({
            url : ("/" + serverURL + "/dataGrid/getChilds"),
            type : "POST",
            data : {
                primaryId : primaryId,
                isFlat : isFlat,
                column : col
            },
            success : function(result) {
                                }
        });
    }

这将返回

returnMap as JSON ==========================[statusFlag:SUCCESS, data:[[<a onclick="viewEmpDetails('56374e74f45f064d33b57583','false','UniqueId')" title='View' style='cursor:pointer'><i class='ace-icon fa fa-search-plus grey' style='width:30px;'> </i></a>, <a onclick="getChilds('8','false','UniqueId')" title='View' style='cursor:pointer'><i class='ace-icon fa fa-search-plus grey' style='width:30px;'> </i></a>   Bhagyawan, 02/02/49, 02/08/81, 15/02/1836, 15-Jan-2012, 10-Feb-25]]]

结果的数据部分实际上是一行数据。 它有两行数据，可能是三行，具体取决于查询，我需要在下面添加到点击的行。

动态创建表

<div class="row">
        <div class="col-xs-12">

            <table id="data-grid-table-tree" class="datasetTable">
              <tr>
                    <th>View</th>
                    <th align="left">${session.data}</th>
                    <g:if test="${session.fieldsToFetch }">
                    <g:each in="${session.fieldsToFetch}"  var="column">
                        <th >${column }</th>

                    </g:each>
                    </g:if>
                                      </tr>
              <tr>
                   <g:each in="${session.treeGridJsonObject}"  var="lists">
                    <tr align="left">
                        <g:each in="${lists}"  var="list">
                               <td align="left">${raw(list)}</td>

                        </g:each>
                    </tr>
                   </g:each>              

            </table>

有人帮忙!

Answer 1

<table border="2">
    <tr><td>test1</td></tr>
     <tr><td>test1</td></tr>
     <tr><td>test1</td></tr>
</table>


$(document).ready(function(){
    $('table tr:nth-child(1)').after('<tr><td>test2</td></tr>');
});

$('table tr:nth-child(1)') - 将其作为您选择的行。

将您的结果记录转换为表格行 html，然后使用上面的代码附加您的表格行。

jsfiddle