Add to cart

Configure Actions to allow adding to cart. Note that you would have to provide the code for the action, e.g. an API call for you cart API.

<script>
function LBInitAutocomplete() {
  AutoComplete({
    Layout: 'heromobile',
    TrackerId: '179075-204259',
    Locale: 'en',
    Translations: {
      en: {
        types: {
          item: {
            name: "Products",
            heroName: "Top product"
          },
          query: {
            name: "Searches"
          },
          category: {
            name: "Categories"
          }
        }
      }
    },
    Types: [
      {
        type: 'product',
        size: 7
      },
      {
        type: 'query'
      },
      {
        type: 'category'
      }
      ],
       Actions: [
        {
          forRow: function(row) {
            return row.type === 'product'
          },
          iconUrl: '/buy.jpg',
          title: 'Add to cart',
          action: function(e, result) {
            e.preventDefault();
            alert("Product added to cart");
          }
        }
      ]
  }, '#q')
}
</script>

<script src="https://cdn.luigisbox.com/autocomplete.js" async onload="LBInitAutocomplete()"></script>
<link rel="stylesheet" href="https://cdn.luigisbox.com/autocomplete.css"/>
Previous example
Customizing no results message
Hero layout examples

Try it out →

Next example
Customizing attributes
Hero layout examples

Try it out →