js动态添加行并保存到数据库

<table id="dataTable">
  <tr>
    <th>Name</th>
    <th>Age</th>
  </tr>
</table>
<button onclick="addRow()">Add Row</button>

function addRow() {
  const table = document.getElementById('dataTable');
  const row = table.insertRow(-1);
  const cell1 = row.insertCell(0);
  const cell2 = row.insertCell(1);
  cell1.contentEditable = 'true';
  cell2.contentEditable = 'true';

  // 添加保存按钮
  const saveButton = document.createElement('button');
  saveButton.innerHTML = 'Save';
  saveButton.onclick = function() {
    const name = cell1.innerText;
    const age = cell2.innerText;
    saveToDatabase(name, age);
  };
  row.appendChild(saveButton);
}

function saveToDatabase(name, age) {
  const xhr = new XMLHttpRequest();
  xhr.open('POST', '/saveData', true);
  xhr.setRequestHeader('Content-Type', 'application/json');
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      alert('Data saved successfully!');
    }
  };
  xhr.send(JSON.stringify({ name: name, age: age }));
}

const express = require('express');
const bodyParser = require('body-parser');
const app = express();

app.use(bodyParser.json());

app.post('/saveData', (req, res) => {
  const { name, age } = req.body;
  // 这里应该有保存到数据库的代码
  console.log(`Saving ${name}, ${age} to database`);
  res.sendStatus(200);
});

app.listen(3000, () => {
  console.log('Server running on port 3000');
});