如何实现搜索医生后编辑文本框并同步更新MySQL数据库

我直接给你一套可落地的改造方案，分前端交互和后端数据库更新两部分来做：

一、改造结果页的前端代码 #

先把你的现有页面调整下，添加编辑/保存按钮，并用JS处理文本框的禁用/启用状态：

<?php if ($row = mysqli_fetch_array($r_query)){ ?>
  <div class="doctor-profile">
    <!-- 显示医生信息的禁用文本框 -->
    <div class="form-group">
      <label>医生姓名：</label>
      <input type="text" name="doc_name" value="<?php echo htmlspecialchars($row['doctor_name']); ?>" disabled class="doc-field">
    </div>
    <div class="form-group">
      <label>所属科室：</label>
      <input type="text" name="doc_dept" value="<?php echo htmlspecialchars($row['department']); ?>" disabled class="doc-field">
    </div>
    <!-- 其他需要编辑的字段同理添加 -->
    
    <!-- 隐藏的医生ID，用来定位要修改的数据库记录 -->
    <input type="hidden" id="doc-id" value="<?php echo $row['id']; ?>">
    
    <!-- 操作按钮 -->
    <button id="edit-btn" class="btn">编辑信息</button>
    <button id="save-btn" class="btn" style="display: none;">保存修改</button>
  </div>
<?php } ?>

<!-- 添加JS交互 -->
<script>
// 获取页面元素
const editBtn = document.getElementById('edit-btn');
const saveBtn = document.getElementById('save-btn');
const docId = document.getElementById('doc-id');
const docFields = document.querySelectorAll('.doc-field');

// 编辑按钮点击事件：启用文本框，切换按钮显示
editBtn.addEventListener('click', () => {
  docFields.forEach(field => {
    field.disabled = false;
    field.style.outline = '1px solid #409eff'; // 加个边框提示可编辑
  });
  editBtn.style.display = 'none';
  saveBtn.style.display = 'inline-block';
});

// 保存按钮点击事件：提交修改到后端
saveBtn.addEventListener('click', () => {
  // 收集修改后的数据
  const formData = new FormData();
  formData.append('doctor_id', docId.value);
  formData.append('doctor_name', document.querySelector('input[name="doc_name"]').value);
  formData.append('department', document.querySelector('input[name="doc_dept"]').value);
  // 其他字段依次添加

  // 用AJAX提交，避免页面刷新
  fetch('save_doctor.php', {
    method: 'POST',
    body: formData
  })
  .then(res => res.text())
  .then(result => {
    if (result === 'success') {
      alert('修改已成功保存！');
      // 恢复文本框禁用状态，切换按钮
      docFields.forEach(field => {
        field.disabled = true;
        field.style.outline = '';
      });
      editBtn.style.display = 'inline-block';
      saveBtn.style.display = 'none';
    } else {
      alert(`保存失败：${result}`);
    }
  })
  .catch(err => {
    console.error('请求出错：', err);
    alert('网络异常，保存失败！');
  });
});
</script>

二、编写后端保存接口（save_doctor.php） #

这个文件负责接收前端提交的修改数据，更新到MySQL数据库：

<?php
// 替换成你的数据库连接信息
$db_host = 'localhost';
$db_user = '你的数据库用户名';
$db_pass = '你的数据库密码';
$db_name = '你的数据库名称';

// 连接数据库
$conn = mysqli_connect($db_host, $db_user, $db_pass, $db_name);
if (!$conn) {
  die('数据库连接失败：' . mysqli_connect_error());
}

// 只处理POST请求
if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
  echo '非法请求';
  exit;
}

// 获取并转义数据，防止SQL注入
$doctor_id = mysqli_real_escape_string($conn, $_POST['doctor_id']);
$doctor_name = mysqli_real_escape_string($conn, $_POST['doctor_name']);
$department = mysqli_real_escape_string($conn, $_POST['department']);
// 其他字段同理处理

// 执行更新SQL
$sql = "UPDATE 你的医生表名 SET doctor_name = '$doctor_name', department = '$department' WHERE id = $doctor_id";
if (mysqli_query($conn, $sql)) {
  echo 'success';
} else {
  echo mysqli_error($conn);
}

// 关闭数据库连接
mysqli_close($conn);
?>

几个注意事项 #

• 记得把代码里的数据库连接信息、医生表名替换成你自己的实际内容
• 可以给文本框加更多验证（比如姓名不能为空），在前端JS或者后端PHP里都能处理
• 如果不想用AJAX，也可以用传统表单提交，把所有字段放到<form>标签里，提交到save_doctor.php后再跳转回结果页就行

内容的提问来源于stack exchange，提问作者Mr Boolean