点击复选框修改MySQL查询条件的PHP+AJAX问题求助

嘿，作为PHP新手遇到这种AJAX和PHP交互的问题很正常，咱们一步步拆解你的代码，解决这个postdata始终为0的问题：

1. AJAX函数里的变量作用域坑 #

先看你的checkchanged()函数，这里有个明显的变量引用错误：

function checkchanged(){
    if(document.getElementById("togBtn").checked == true){
        var self = this;
        self.postdata = 1;
    } else{
        var self = this;
        self.postdata = 0;
    }
    $.ajax({
        type: 'POST',
        url: 'wificode.php',
        data:{'postdata': postdata}, // 这里的postdata没正确指向你定义的值
        success: function(response){
            alert('postdata'); //location.reload();
        }
    });
}

你把postdata挂载到了self（全局window对象），但AJAX里直接写postdata会找不到这个变量，或者拿到旧值。咱们简化一下逻辑，直接用局部变量：

function checkchanged(){
    // 一行代码搞定复选框状态判断
    let postdata = document.getElementById("togBtn").checked ? 1 : 0;
    $.ajax({
        type: 'POST',
        url: 'wificode.php',
        data: {'postdata': postdata},
        success: function(response){
            // 必须刷新页面才能看到新的查询结果，把注释去掉
            location.reload();
            // 可以改成alert(`提交的值是: ${postdata}`)验证是否传对了
        }
    });
}

2. PHP页面的两个关键问题 #

问题一：$data未初始化导致JS报错 #

你的PHP里$data只有在查询有结果时才赋值，如果没查到数据，$data就是未定义状态，会导致后面的JS代码报错。给它加个初始值：

<?php
// 初始化postdata为0，简化写法
$postdata = isset($_POST["postdata"]) ? $_POST["postdata"] : '0';
// 初始化$data为空，避免未定义错误
$data = '';

$link = new mysqli("127.0.0.1","******","******","secretariaat");
if (!$link) {
    echo "Error: Unable to connect to MySQL." . PHP_EOL;
    echo "Debugging errno: " . mysqli_connect_errno() . PHP_EOL;
    echo "Debugging error: " . mysqli_connect_error() . PHP_EOL;
    exit;
}

问题二：SQL注入风险+查询逻辑优化 #

你直接把$postdata拼进SQL语句里，虽然现在值只有0和1，但养成用预处理语句的习惯很重要，能彻底避免SQL注入：

// 改用预处理语句
$query = "SELECT * FROM wifi WHERE vervaldatum >= CURDATE() AND gebruikt = '0' AND meerdere = ? LIMIT 1;";
$stmt = $link->prepare($query);
$stmt->bind_param("i", $postdata); // "i"表示整数类型，匹配你的0/1值
$stmt->execute();
$result = $stmt->get_result();

while ($row = $result->fetch_assoc()) {
    echo"<button value='".$row["id"]."'>".$row["code"]."</button>";
    $data = $row["id"];
}

// 记得释放资源
$result->free();
$stmt->close();
mysqli_close($link);
?>

3. 更优雅的事件绑定（可选） #

既然你已经在用jQuery，不如把复选框的事件也用jQuery绑定，避免全局函数的问题：

$(document).ready(function(){
    // 绑定复选框change事件
    $("#togBtn").on("change", function(){
        let postdata = $(this).is(":checked") ? 1 : 0;
        $.ajax({
            type: 'POST',
            url: 'wificode.php',
            data: {'postdata': postdata},
            success: function(response){
                location.reload();
            }
        });
    });

    // 原有的按钮点击逻辑
    var postid = <?php echo json_encode($data, JSON_HEX_TAG); ?>;
    $("button").click(function(){
        $.ajax({
            type: 'POST',
            url: 'processwifi.php',
            data:{'postid': postid},
            success: function(response){
                location.reload();
            }
        });
    });
});

验证步骤 #

1. 打开浏览器F12开发者工具，切换到Network面板
2. 点击复选框，观察AJAX请求的Form Data里是否正确携带了postdata=1或postdata=0
3. 页面刷新后，看看生成的按钮是不是符合你根据meerdere值筛选的预期

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