我在从模态表单更新 MySQL 表值时遇到问题 Sing PHP

Question

我创建了一个模态表单（在单击链接时弹出，即 trigger()）。 这是 HTML 代码：

<div class="modalbg">
      <div class="modalPopup">
        <form action="samepage.php" class="formContainer" method="post">
          <h2>Change Desk Number</h2>
          <label for="studentid">
            <strong></strong>
          </label>
          <input type="password" placeholder="Your KEY" name="studentid" required/>
          <label id="status" style="color:red;"></label>
          <button type="submit" class="btn" onclick="return verify()">Upgrade</button>
          <button type="button" class="btn cancel" onclick="closeForm()">Close</button>
        </form>
      </div>
</div>

控制此模式的 JavaScript 是：

function trigger(){

    document.getElementById("modalPopup").style.display = "block";
            
        
          }
          function closeForm() {
            document.getElementById("modalPopup").style.display = "none";
          }
          function verify() {
                var studentid = document.getElementById("studentid").value;
            if (studentid != dbstudentid || !studentid){
                document.getElementById("status").innerHTML="Invalid Student ID!";
                function trigger(event) { event.preventDefault(); } 
                return false;
                }
            else{
                document.getElementById("modalPopup").submit();
            }
          }

此时一切正常（即，每当我单击链接时它会弹出，并且每当我故意尝试输入错误的学生 ID 时，它会在“状态”标签上返回“无效的学生 ID”。（注意：我已经保存了会话的变量 dbstudentid 中的学生 ID 使用：

var dbstudentid = <?php echo json_encode($dbstudenid);?>;

然而，当我尝试在同一页面上执行 PHP 时，我的问题就出现了。

每当我将 PHP 代码插入其中的 modalbg div 或 modalPopup div 时，整个 modal 都拒绝弹出，更不用说提交了。

这是我使用的 PHP 代码（需要注意的是，在页面的开头，我已经使用了include(configure-db.php)和session_start() ）：

<?php


if(isset($_POST['studentid'])){
  $studentid = $_POST['studentid'];
  $desk = 1;
  $deskstatus ="";
        
  $select = "UPDATE users SET deskNo = '$desk' WHERE name='$SESSION';
}

if (mysqli_query($MyConn, $select)) {
  $deskstatus = "Desk changed successfully!";
} else {
  $deskstatus = "Error";
} return $deskstatus;
?>

我已经尝试了一切，模式只是拒绝每次都来，更不用说成功地在我的数据库上进行桌面更新了。 更糟糕的是，每当我刷新页面时，我设置为display:none; 默认情况下，CSS 突然开始显示。 但是每当我删除 PHP 代码时，它就会恢复正常。

我是否需要在单独的页面中执行action ？ 如果是，请问如何？ 否则，请问如何？

Answer 1

我强烈建议您考虑使用AJAX来处理这个问题。 让我们把事情弄清楚。

1. 你可以写var dbstudentid = '<?= $dbstudenid ?>'; 而不是var dbstudentid = <?php echo json_encode($dbstudenid);?>; 这将为您提供 JS 原生数据类型的自由。

2. 您需要通过 ajax 发送此表单请求并在那里接收输出。

3. 将php代码的其他部分更改为这样

   else { $deskstatus = "Error: " . mysqli_error($MyConn); }

现在，当代码出现实际问题时，您将知道问题出在哪里。 它不会破坏你的界面。 4. 创建处理此表单请求的单独文件。 5.这是plaing JS AJAX实现的代码片段

let post = JSON.stringify(postObj)

const url = "https://jsonplaceholder.typicode.com/posts"
let xhr = new XMLHttpRequest()

xhr.open('POST', url, true)
xhr.setRequestHeader('Content-type', 'application/json; charset=UTF-8')
xhr.send(post);

xhr.onload = function () {
    if(xhr.status === 201) {
        console.log("Post successfully created!");
        let AlertDiv = document.querySelector('#alert');
        AlertDiv.innerHTML =  xhr.response; 
    }
}