PHP OOP无框架库存管理系统$.post搜索功能故障求助

我来帮你排查并解决这个$.post搜索失效的问题，先看看现有代码里的几个关键问题，再一步步给出解决方案：

现有代码的核心问题 #

1. 缺少AJAX请求的实现代码：你只提供了HTML表单和PHP提交逻辑，但完全没有编写点击搜索按钮后触发$.post的jQuery代码，这是功能失效的最直接原因。
2. DOM元素ID重复：页面里两个表单都有id="product_id"的输入框，jQuery选择器会优先匹配第一个元素，导致后续表单填充混乱。
3. 未阻止表单默认提交行为：点击搜索按钮会触发表单的默认提交（页面刷新），AJAX请求还没完成就被中断了。
4. 缺少PHP端的AJAX处理接口：没有专门处理搜索请求的PHP逻辑，无法从数据库查询数据并返回给前端。

分步解决方案 #

1. 修复DOM元素ID冲突 #

把搜索表单里的产品ID输入框ID改成唯一值，比如search_product_id，避免和下方表单的ID重复：

采购页搜索表单修改后：

<form action="" method="post" class="form-search">
 <div class="input-group">
 <input type="text" class="form-control" name="search_product_id" id="search_product_id" placeholder="Search a product by ID">
 <span class="input-group-btn">
 <button name="searchProduct" value="Search" class="btn btn-primary">Search</button>
 </span>
 </div>
</form>

销售页搜索表单同理修改：

<form action="" method="post" class="form-search">
 <div class="input-group">
 <input type="text" class="form-control" name="search_product_id" id="search_product_id" placeholder="Search a product by ID">
 <span class="input-group-btn">
 <button name="searchProduct" value="Search" class="btn btn-primary">Search</button>
 </span>
 </div>
</form>

2. 添加jQuery/AJAX搜索逻辑 #

在页面底部（确保已经引入jQuery库）添加以下脚本，实现搜索按钮点击后的异步请求：

采购页AJAX代码

$(document).ready(function() {
    // 监听搜索表单提交事件
    $('.form-search').on('submit', function(e) {
        // 阻止表单默认刷新行为
        e.preventDefault();
        
        // 获取输入的产品ID
        var productId = $('#search_product_id').val().trim();
        
        // 空值验证
        if(productId === '') {
            alert('请输入产品ID');
            return;
        }
        
        // 发送POST请求到PHP接口
        $.post('ajax-search-product.php', {product_id: productId}, function(response) {
            if(response.status === 'success') {
                // 填充表单字段
                $('#product_id').val(response.data.product_id);
                $('#product_name').val(response.data.product_name);
                // 下拉框需要匹配option的value，设置selected属性
                $('#supplier_name').val(response.data.supplier_id);
                $('#brand_name').val(response.data.brand_id);
                $('#group_name').val(response.data.group_id);
                $('#unit_price').val(response.data.unit_price);
                // 其他字段可根据需求继续填充
            } else {
                alert('未找到该产品');
            }
        }, 'json')
        .fail(function() {
            alert('搜索请求失败，请检查网络或重试');
        });
    });
});

销售页AJAX代码

$(document).ready(function() {
    $('.form-search').on('submit', function(e) {
        e.preventDefault();
        
        var purchaseId = $('#search_product_id').val().trim();
        
        if(purchaseId === '') {
            alert('请输入采购记录ID');
            return;
        }
        
        $.post('ajax-search-purchase.php', {product_purchase_id: purchaseId}, function(response) {
            if(response.status === 'success') {
                // 填充销售表单字段
                $('#product_id').val(response.data.product_id);
                $('#product_name').val(response.data.product_name);
                $('#unit_sale_price').val(response.data.unit_sale_price);
            } else {
                alert('未找到该采购记录');
            }
        }, 'json')
        .fail(function() {
            alert('搜索请求失败，请检查网络或重试');
        });
    });
});

3. 编写PHP AJAX处理接口 #

创建两个PHP文件，分别处理采购页和销售页的搜索请求：

ajax-search-product.php（采购页产品搜索接口）

<?php
// 引入你的数据库连接和格式化工具类
include 'db.php';
include 'formatter.php';

// 设置返回JSON格式
header('Content-Type: application/json');

if(isset($_POST['product_id'])) {
    $productId = $frmt->sanitize(mysqli_real_escape_string($db->link, $_POST['product_id']));
    
    // 使用预处理语句防止SQL注入（更安全）
    $stmt = $db->link->prepare("SELECT * FROM products WHERE product_id = ? LIMIT 1");
    $stmt->bind_param("s", $productId);
    $stmt->execute();
    $result = $stmt->get_result();
    
    if($result->num_rows > 0) {
        $product = $result->fetch_assoc();
        echo json_encode([
            'status' => 'success',
            'data' => $product
        ]);
    } else {
        echo json_encode([
            'status' => 'error',
            'message' => 'Product not found'
        ]);
    }
    $stmt->close();
} else {
    echo json_encode([
        'status' => 'error',
        'message' => 'Invalid request'
    ]);
}
?>

ajax-search-purchase.php（销售页采购记录搜索接口）

<?php
include 'db.php';
include 'formatter.php';

header('Content-Type: application/json');

if(isset($_POST['product_purchase_id'])) {
    $purchaseId = $frmt->sanitize(mysqli_real_escape_string($db->link, $_POST['product_purchase_id']));
    
    $stmt = $db->link->prepare("SELECT * FROM product_purchases WHERE product_purchase_id = ? LIMIT 1");
    $stmt->bind_param("s", $purchaseId);
    $stmt->execute();
    $result = $stmt->get_result();
    
    if($result->num_rows > 0) {
        $purchase = $result->fetch_assoc();
        echo json_encode([
            'status' => 'success',
            'data' => $purchase
        ]);
    } else {
        echo json_encode([
            'status' => 'error',
            'message' => 'Purchase record not found'
        ]);
    }
    $stmt->close();
} else {
    echo json_encode([
        'status' => 'error',
        'message' => 'Invalid request'
    ]);
}
?>

额外优化建议 #

• 引入jQuery库：如果页面还没引入jQuery，在<head>标签里添加：<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>（或者下载到本地引入）。
• 增强输入验证：可以给搜索输入框添加数字验证（比如产品ID是数字），避免无效查询。
• 优化用户体验：搜索时可以添加加载动画，让用户知道请求正在处理。
• 完善SQL注入防护：上面的代码已经用了预处理语句，这比单纯的mysqli_real_escape_string更安全，建议整个系统都采用这种方式。

内容的提问来源于stack exchange，提问作者Ariful Islam Shaon