جستجو و فیلتر محصولات توسط jquery ajax

پاسخ هوش مصنوعی

بله، برای جستجو و فیلتر محصولات می توانید از jQuery، AJAX و JSON استفاده کنید. در اینجا یک نمونه ساده از نحوه انجام این کار ارایه می شود:

HTML:



jQuery:
$(document).ready(function() {
    $('#search').on('keyup', function() {
        var query = $(this).val();
        $.ajax({
            url: 'search.php',
            method: 'GET',
            data: {query: query},
            dataType: 'json',
            success: function(data) {
                $('#product-list').empty();
                if (data.length > 0) {
                    $.each(data, function(index, product) {
                        $('#product-list').append('
' + product.name + '
');
                    });
                } else {
                    $('#product-list').append('
محصولی پیدا نشد.
');
                }
            }
        });
    });
});

PHP (search.php):
query("SELECT * FROM products WHERE name LIKE '%$query%'");
$products = $result->fetch_all(MYSQLI_ASSOC);
echo json_encode($products);
?>

در این مثال، وقتی کاربر چیزی در کادر جستجو وارد می کند، یک درخواست AJAX به سرور ارسال می شود که در آن جستجو انجام می شود و نتایج به صورت JSON بازگشت داده می شوند. سپس، نتایج در div با شناسه `product-list` نمایش داده می شوند.