表单添加ID绑定JS验证后提交时action URL异常跳转至index.php如何解决

核心问题定位 #

你遇到的跳转问题和表单action属性无关，是save.php代码错误导致提交后强制跳转至index.php，具体问题如下：

• 变量拼写错误：执行插入SQL后定义的变量是$save，但判断条件错误写为$ave，未定义的变量默认判断为false，永远走失败分支跳转至index.php
• 语法错误：插入成功后的echo语句末尾缺失分号，会触发PHP语法报错，导致后续逻辑无法正常执行
• 安全风险：直接将用户输入的name、address拼接进SQL语句，存在严重SQL注入漏洞

修复后的save.php代码 #

<?php
session_start();
include 'config.php';

// 优先判断请求方式再校验提交参数
if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['save'])) {
    $nm = trim($_POST['name']);
    $ad = trim($_POST['address']);
    // 改用预处理语句防止SQL注入，适配mysqli连接场景
    $stmt = $config->prepare("INSERT INTO people VALUES ('', ?, ?)");
    $stmt->bind_param("ss", $nm, $ad);
    $save = $stmt->execute();

    if ($save) {
        echo "<script>alert('saved success'); window.location.href='index.php?page=people';</script>";
    } else {
        // 调试阶段可开启下方代码查看数据库报错信息
        // echo $config->error;
        echo "<script>alert('save fail'); window.location.href='index.php';</script>";
    }
} else {
    header('Location: index.php');
}
?>

可选调试逻辑（非必须） #

如果需要确认表单确实提交到了指定的action地址，可以在前端验证逻辑中添加调试代码，确认验证通过后的提交目标地址是否正确：

// 加在validator定义完成之后即可
validator.on('core.form.valid', function() {
    console.log('表单提交目标地址：', document.getElementById('kt_form').action);
});

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