从填充的mysql下拉列表中插入选定的值

<select id="myDropdown"></select>
<button onclick="insertSelectedValue()">提交</button>

<script>
  // AJAX请求后端接口获取下拉列表的选项值
  fetch('/api/options')
    .then(response => response.json())
    .then(data => {
      const dropdown = document.getElementById('myDropdown');
      data.forEach(option => {
        const optionElement = document.createElement('option');
        optionElement.value = option.value;
        optionElement.textContent = option.label;
        dropdown.appendChild(optionElement);
      });
    });

  // 提交选定的值给后端接口
  function insertSelectedValue() {
    const selectedValue = document.getElementById('myDropdown').value;
    fetch('/api/insert', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ value: selectedValue })
    })
      .then(response => response.json())
      .then(data => {
        // 处理插入成功后的逻辑
      });
  }
</script>

const express = require('express');
const app = express();
const mysql = require('mysql');

// 创建MySQL数据库连接
const connection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: 'password',
  database: 'mydatabase'
});

// 获取下拉列表的选项值
app.get('/api/options', (req, res) => {
  connection.query('SELECT * FROM options', (error, results) => {
    if (error) throw error;
    res.json(results);
  });
});

// 插入选定的值到数据库
app.post('/api/insert', (req, res) => {
  const selectedValue = req.body.value;
  connection.query('INSERT INTO options (value) VALUES (?)', [selectedValue], (error, results) => {
    if (error) throw error;
    res.json({ success: true });
  });
});

// 启动服务器
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

CREATE TABLE options (
  id INT AUTO_INCREMENT PRIMARY KEY,
  value VARCHAR(255)
);