如何正确使用刷新 div？

Question

嗨，

你能解释一下为什么我的刷新 div 不起作用吗？单击提交时，似乎 div 正在尝试通过删除所有行数据来刷新，但它没有返回任何内容，而是将 div 留空。存储到数据库的数据很好，但我需要 div 刷新并显示所有新提交的数据

$('#submitBtm').on('click', onSubmit = () => {

    const first_nameV = document.getElementById("first_name").value;
    const last_nameV = document.getElementById("last_name").value;
    const emailV = document.getElementById("email").value;
    const departmentV = document.getElementById("department").value;
        
        $.ajax({
            type: "POST",
            url: `companydirectory/libs/php/insertAll.php?first_name=${first_nameV}&last_name=${last_nameV}&email=${emailV}&departmentID=${departmentV}`,
            success: function(data) {
               
            },
            error:  function(request,error) {
                console.log(request)                                   
            }
        })

        $("#id_data").load(location.href + " #id_data");

    event.preventDefault();
})

在 HTML 页面上

<div class="listTable">
     <tbody id="id_data">
                        
     </tbody>
</div>

Answer 1

它不会更新，因为您没有附加在成功回调中收到的新数据

  $.ajax({
        type: "POST",
        url: `companydirectory/libs/php/insertAll.php?first_name=${first_nameV}&last_name=${last_nameV}&email=${emailV}&departmentID=${departmentV}`,
        success: function(data) {
           // here you have the data and you can refresh the table
        },
        error:  function(request,error) {
            console.log(request)                                   
        }
    })