Question

提交jquery对话框时，我收到如下所示的ajax响应

<tr bgcolor="" id="row_4">
  <td><p>ffwrwrqwrvqwerf</p></td>
  <td>Active</td><td><a href="" class="link_btn"  id="4_edit">Edit</a> | <a href="" class="link_btn"  id="4_delete">Delete</a></td>
</tr>

我需要将Datatable行#row_4修改为ajax响应。

// msg is the variable which stores the ajax response.

 $('#lstCategories').DataTable().row($('#row_'+$('#formid').val())).data($(msg)).draw();

这给我一个错误。当我在语句msg中放置变量$(msg)而不是$('#lstCategories').DataTable().row($('#row_'+$('#formid').val())).data($(msg)).draw();时，它在第一个td中给了我<<，在第二个td中给了我't'，在第三个td中给了我，但是没有错误。

Answer 1

您的Ajax结果已经具有<tr>。因此，您可以删除特定行，并可以添加新行

请检查演示代码

    $(document).ready(function () {
        $('#myTable').DataTable();

        $("#editButton").click(function () {
            var tbl = $('#myTable').DataTable();
            tbl.row("#row_2").remove().draw();
            var tblRow = "<tr id='row_2'><td>Value 3 - edited</td><td>Value 4 -edited</td></tr>";
            tbl.rows.add($(tblRow)).draw();
        });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.css" />
<table id="myTable">
    <thead>
        <tr>
            <td>Title 1</td>
            <td>Title 2</td>
        </tr>
    </thead>
    <tbody>
        <tr id="row_1">
            <td>Value 1</td>
            <td>Value 2</td>
        </tr>
        <tr id="row_2">
            <td>Value 3</td>
            <td>Value 4</td>
        </tr>
        <tr id="row_3">
            <td>Value 4</td>
            <td>Value 5</td>
        </tr>
    </tbody>
</table>

<input id="editButton" type="button" value="Edit" />

DataTable更新现有行问题ajax

1 个答案: