Ajax Search Autocomplete

Mage2Expert Ajax Search Autocomplete is an extension for Magento 2 that replaces the default search suggestion dropdown with a richer, fully configurable live search experience. As a shopper types into the header search box, matching products appear instantly with image, name, SKU, and price, plus a one-click Add to Cart button that adds the item over AJAX without leaving the page or losing the dropdown. Store owners choose exactly which product attributes are searched, how many characters trigger a lookup, how long to wait before firing the request, and how many results to display — all from a single configuration screen, with no template edits. The dropdown itself can be switched between four built-in layouts (List, Grid, Compact, and Card) to match any storefront design. Because matching runs directly against the selected product attributes rather than the catalog search index, results stay accurate and predictable regardless of indexer schedule or which search engine the store uses. A REST endpoint exposes the same suggestion data for headless storefronts, PWAs, and custom JavaScript integrations. All settings are store-view scoped, and the extension can be disabled instantly from the admin panel without losing any configuration. 

Features

• Instant AJAX Search Suggestions — matching products appear in a styled dropdown as the shopper types, with a configurable minimum character count and a debounce delay before the request fires.
• Rich Product Rows — each result row can show the product image, name, SKU, and price, with every field independently toggled on or off from General and Display Settings.
• One-Click Add to Cart — uses Magento's standard AJAX add-to-cart flow, the same mechanism used on category and search result listing pages. The mini-cart updates in place and the shopper is never redirected away from the page they are browsing.
• Four Dropdown Layouts — List, Grid, Compact, and Card layouts are switchable from a single Layout Settings field, with no theme or template changes required.
• Configurable Search Fields — choose which product attributes (Product Name, SKU, Short Description, Description) the typed text is matched against, giving store owners precise control over result relevance.
• Index-Independent Matching — search runs directly against the selected product attributes rather than the catalog search index, so results are unaffected by MySQL, Elasticsearch, or OpenSearch indexer status.
• Accurate Pricing for Every Product Type — prices are read through Magento's pricing framework, so simple, configurable, bundle, and grouped products all display the correct price in the dropdown.
• "View All Results" Link — an optional, configurable link routes shoppers to the full catalog search results page for their query.
• Custom Dropdown Text — the "No Results Found", "Loading", and "View All Results" messages are all editable from the admin panel.
• REST API Endpoint — GET /V1/ajaxsearch/suggest returns the same suggestion data used by the storefront dropdown, available anonymously for headless and custom storefront integrations.
• Store-View Scope Throughout — every configuration field (General, Display, Layout, API) is store-view scoped, making the extension suitable for multi-store and multi-language setups.
• Enable / Disable without Uninstalling — a master Enable Ajax Search switch in Stores → Configuration → Magento Expert → Ajax Search reverts the storefront to Magento's default search suggestions while preserving every setting. Re-enabling restores everything immediately.
• Zero Core Code Modifications — built entirely on a RequireJS mixin over Magento's own search widget and a plugin on the native autocomplete service. No class rewrites, no preferences, no patches. Safe alongside Magento upgrades and other extensions.

How It Works

After enabling the extension, go to Stores → Configuration → Magento Expert → Ajax Search and review the General Settings: minimum characters to trigger search, search delay, maximum results, and the product attributes to search against. Display Settings control which fields appear in each result row and the Add to Cart button. Layout Settings choose between List, Grid, Compact, and Card. Save the configuration and flush the cache — no further setup is required. On the storefront, typing into the header search box immediately shows the configured dropdown experience. 

Dropdown Layouts

Four layouts are available from a single Layout Settings field, each suited to a different storefront style: 

• List — one product per row with image, name, SKU, price, and Add to Cart side by side. The best general-purpose layout.
• Grid — two products per row in image-on-top cards, suited to visually dense themes.
• Compact — text-only dense rows showing name and price only, ideal for narrow search boxes where speed of scanning matters most.
• Card — single-column boxed cards with generous spacing for a more prominent, editorial feel.

REST API

GET /V1/ajaxsearch/suggest?q={search text} is registered as an anonymous resource and returns matched products, the total match count, and the URL to the full search results page — the exact data used to render the storefront dropdown. This makes the endpoint a convenient source for PWA Studio, headless storefronts, and custom JavaScript search integrations. The endpoint can be disabled independently from the storefront dropdown via the Enable REST API setting. 

Use Cases

• Catalogs with many SKUs — help shoppers find products instantly without waiting for a full page load, reducing search abandonment.
• Conversion-focused stores — let shoppers add a product to cart directly from the search dropdown, shortening the path from search to purchase.
• Stores with strict naming conventions — restrict search matching to Product Name and SKU only, avoiding noisy matches from long description text.
• Headless and PWA storefronts — consume the REST endpoint directly to power a custom search-as-you-type experience outside the default Luma or Blank theme.
• Multi-store retailers — configure different search fields, layouts, and result limits per store view to match each brand's storefront design.