我如何将选中的行发送到数据表的第一行

Question

此代码实际上可以添加行，但是当我检查主要联系人时，它没有发送到第一行，而是发送到最后一行，请帮助我解决此问题。

  //add row in contact
  $(document).ready(function () {
      var table = $('#lv_Lead_Contact_Information-datatable').DataTable({
          dom: "t"
      });

      //ensure the primary contract is only one
      $(document).on('change', '.primary-contact-checkbox', function () {
          if (this.checked) {
              // Uncheck all other checkboxes
              $('.primary-contact-checkbox').not(this).prop('checked', false);

              // Get the row of the checked checkbox
              var row = $(this).closest('tr');

              // Move the row to the top of the table
              row.fadeOut(function () {
                  table.row(row).remove().draw(false);
                  table.row.add(row[0]).draw(false);
                  row.fadeIn();
              });
          }
      });

      $(document).on('click', '#btnAddContact', function () {
          table.row.add([
              '<input type="checkbox" class="form-check-input primary-contact-checkbox" style="vertical-align: middle; margin-left: 21px;">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="text" class="form-control form-control-borderless">',
              '<input type="checkbox" class="" style="vertical-align: middle; margin-left: 19px;">',
              '<input type="text" class="form-control form-control-borderless">'
          ]).draw();
      });
  });

Answer 1

我认为您要寻找的是当您选择主要联系人行时，该行应自动移动到表格的第一行。

document.addEventListener('DOMContentLoaded', function () {
const table = document.getElementById('myTable');
const checkboxes = table.querySelectorAll('.row-checkbox');

checkboxes.forEach(checkbox => {
    checkbox.addEventListener('click', function () {
        const row = this.closest('tr'); // Get the row containing the clicked checkbox
        const tbody = table.querySelector('tbody'); // Get the table body

        // Remove the row from its current position
        tbody.removeChild(row);

        // Insert the row at the top of the table body
        tbody.insertBefore(row, tbody.firstChild);
    });
});
});