PHP ve JavaScript ile oluşturulan kodda hata nerede?

<div id="products">
            <h1 class="text-center mb-4">Products Page</h1>
            <div class="filter-bar">
                <input type="text" placeholder="Search Products..." id="searchProducts">
                <select id="categoryFilter">
                    <option value="">Category</option>
                    <!-- Categories dynamically fetched from database -->
                </select>
                <button id="addProductBtn">+ Add Product</button>
            </div>
            <table class="product-table">
                <thead>
                    <tr>
                        <th>Product Name</th>
                        <th>Price</th>
                        <th>Category</th>
                        <th>Color</th>
                        <th>Stock</th>
                        <th>Date</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    <!-- Dynamically populated products from database -->
                </tbody>
            </table>
        </div>

const fetchProducts = async (query = "", categoryId = "") => {
        try {
            const url = `backend/api/products.php?action=products&search=${encodeURIComponent(query)}&category=${encodeURIComponent(categoryId)}`;
            const response = await fetch(url);
            if (!response.ok) {
                throw new Error("Failed to fetch products");
            }
            const products = await response.json();
            displayProducts(products);
        } catch (error) {
            console.error("Error fetching products:", error);
            alert("An error occurred while fetching products.");
        }
    };

    // Display products in the table
    const displayProducts = (products) => {
        const tbody = document.querySelector(".product-table tbody");
        tbody.innerHTML = "";

        if (Array.isArray(products) && products.length > 0) {
            products.forEach((product) => {
                const row = document.createElement("tr");
                row.innerHTML = `
                    <td>${product.name}</td>
                    <td>${product.price}</td>
                    <td>${product.category_name}</td>
                    <td>${product.color}</td>
                    <td>${product.stock}</td>
                    <td>${new Date(product.created_at).toLocaleString()}</td>
                    <td>
                        <button class="edit-btn" data-id="${product.id}">Edit</button>
                        <button class="delete-btn" data-id="${product.id}">Delete</button>
                    </td>
                `;
                tbody.appendChild(row);
            });

            attachButtonListeners(); // bu kısım butonların işlevlerini tetikliyor o yüzden yollamıyorum
        } else {
            tbody.innerHTML = "<tr><td colspan='7'>No products found</td></tr>";
        }
    };

//db.php
try {
    $dsn = 'mysql:host=localhost;dbname=database;charset=utf8mb4';
    $username = '';
    $password = '';

    $pdo = new PDO($dsn, $username, $password, [
        PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
        PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
        PDO::ATTR_EMULATE_PREPARES => false,
    ]);
} catch (PDOException $e) {
    error_log('Database connection failed: ' . $e->getMessage(), 3, 'errors.log');
    die('Database connection failed.');
}
//db.php
$action = $_GET['action'] ?? '';
switch ($action) {
    case 'categories':
        getCategories($pdo);
        break;

    case 'products':
        getProducts($pdo);
        break;
        //devam ediyor
}
function getProducts($pdo)
{
    try {
        // Sanitize input
        $search = htmlspecialchars($_GET['search'] ?? '', ENT_QUOTES, 'UTF-8');
        $categoryId = isset($_GET['category']) ? filter_var($_GET['category'], FILTER_VALIDATE_INT) : null;

        // Debugging: Log search and category
        error_log("Search: $search");
        error_log("Category ID: " . var_export($categoryId, true));

        // Base query
        $query = "SELECT p.id, p.name, p.price, c.name AS category_name, p.color, p.description, p.stock, p.created_at
                  FROM products p
                  LEFT JOIN categories c ON p.category_id = c.id
                  WHERE 1=1";

        // Apply search filter if search term exists
        if (!empty($search)) {
            $query .= " AND (p.name LIKE :search OR p.description LIKE :search)";
        }

        // Apply category filter if category ID exists
        if ($categoryId !== null) {
            $query .= " AND p.category_id = :category_id";
        }

        $stmt = $pdo->prepare($query);

        // Bind parameters only if they are part of the query
        if (!empty($search)) {
            $stmt->bindValue(':search', "%$search%", PDO::PARAM_STR);
        }

        if ($categoryId !== null) {
            $stmt->bindValue(':category_id', $categoryId, PDO::PARAM_INT);
        }

        $stmt->execute();
        $products = $stmt->fetchAll(PDO::FETCH_ASSOC);

        // Return the result as JSON
        echo json_encode($products);
        http_response_code(200);
    } catch (Exception $e) {
        error_log('Error: ' . $e->getMessage());
        echo json_encode(['error' => 'Failed to fetch products', 'message' => $e->getMessage()]);
        http_response_code(500)
    }
}