Configuring a nested or conditional option set flow for customers

How to use NextMenuItemOptionSetId property to configure advanced customer flows for your menus

Overview

Often, it's necessary to only ask a customer a question based on their answer to a previous one.

Let's consider the use case of your local salad counter. They have a "Ceasar Salad" menu item.
The first question that the customer is asked is "Would you like that in a bowl or a wrap"?
If the customer answers "wrap", we want to then ask the customer "What kind of wrap would you like? Tomato? Plain?" etc...

However, if the customer selects "bowl", it does not make sense to ask them what kind of wrap they'd like. In this case, we need to skip the "wrap options" group, and go straight to "Greens"

What is NextMenuItemOptionSetId

NextMenuItemOptionSetId is an optional property on option set items. It can be used to enhance the customer's ordering experience in two ways.

  1. By giving this property the value of an option set ID that appears later in the menu item, you can "link" the customer directly to that option set, effectively skipping one or more option sets.
  2. By giving this property the value of -1. When the customer selects an option set item with this value, the ordering flow is stopped and the item is added to the customer's basket. Learn more below
14701470

Configuring a conditional flow via API

Setting the NextMenuItemOptionSetId is currently possible via the /createnewmenuforapp endpoint. This means you'll need to build your menu JSON with the entire structure you need, and post it to that endpoint.

The NextMenuItemOptionSetId values you provide must either be null, -1, or reference an option set ID you've defined later in the flow for the same menu item.

It is not necessary to first create the option sets and option set items via any API first, simply construct the JSON in the structure you need it, and post it to the /createnewmenuforapp endpoint.

Code Sample

See below an example of the JSON you'd need to achieve a conditional flow.
Notice we're defining a NextMenuItemOptionSetId value for the "Bowl" option set item of 33237703.

This is the same value for the "Choose your greens" question. Therefore, when a customer selects "Bowl" when ordering, they will be linked directly to the "Choose your greens" option set, and not be presented with the "Choose your wrap" option set.

{
  ...
  "Name": "Caesar Salad",
  "Description": "",
  "Price": 0.00,
  "IsAvailable": true,
  "MenuItemOptionSets": [
    {
      ...
      "Name": null,
      "MenuItemOptionSetId": 33237700,
      "MenuItemOptionSetItems": [
        {
          ...
          "Name": "Bowl",
          "Price": 6.95,
          "NextMenuItemOptionSetId": 33237703, // Selecting this option "links" the customer to the option set with this ID
        },
        {
          ...
          "Name": "Wrap",
          "Price": 6.45,
          "NextMenuItemOptionSetId": null,
        }
      ]
    },
    {
      ...
      "Name": "Choose your wrap",
      "MenuItemOptionSetId": 33237701,
      "MenuItemOptionSetItems": [
        {
          ...
          "Name": "Plain (258 Cal)",
          "Price": 0.00,
          "NextMenuItemOptionSetId": null,
        },
        {
          ...
          "Name": "Wholemeal (258 Cal)",
          "Price": 0.00,
          "NextMenuItemOptionSetId": null,
        }
      ]
    },
    {
      ...
      "Name": "Choose your greens",
      "MenuItemOptionSetId": 33237703,
      "MenuItemOptionSetItems": [
        {
          ...
          "Name": "Rocket (21.6 Cal)",
          "Price": 0.00,
          "NextMenuItemOptionSetId": null,
        },
        {
          ...
          "Name": "Spinach (30 Cal)",
          "Price": 0.00,
          "NextMenuItemOptionSetId": null,
        }
      ]
    }
  ]
}

-1 as a possible value

Giving an option set item the NextMenuItemOptionSetId value of -1 will mean that when the customer selects that option, all subsequent option sets in the flow are not shown, meaning the item is immediately added to the customer's basket.

This is useful for scenarios where the menu item has many options to choose from, but you want to offer the customer the option to not make any more selections.

Consider the scenario of an ice cream shop. You may want to let your customers endlessly customise their ice cream with toppings, sauces and other addons. This means that you configure many option sets. For customers who just want a plain ice cream, however, this would require them to click "Next" many many times.

In this scenario, creation an option with a name such as "no more customisations" and giving it a NextMenuItemOptionSetId value of -1 will let the customer end the flow early and add the item to their basket, making for a better consumer experience.

Known Limitations

  • The flow is linear, and can only move forward. You cannot link backwards to a previous option set using this method.