Single-Choice Button Display (Button Group) Custom Field – One-Tap Options & Dynamic Pricing

The Single-Choice Button Display (Button Group) custom field turns a plain radio list into a modern, touch-friendly row of buttons. One tap chooses a single option, instantly updating price or labour time if you’ve attached surcharges or minutes. Because a button group stores a clear, single value, it can drive conditional logic, reporting filters, and worker matching just like a traditional radio group, while delivering a faster, more engaging UI across desktop and mobile interfaces.

1 . What is a Button Group field?

A button group is rendered with the radiogroup pattern, so only one button can be active at a time, exactly like a classic radio button—but with the visual punch of segmented controls. Assistive technologies read it as a single choice list when you add role=”group” and a label.

Why not use a dropdown?

Button groups show every option up-front; no tap needed to reveal a list. This reduces decision time and eliminates mis-taps on mobile.

Numeric, time and geo add-ons

Any option can carry:

• Flat / per-unit / % surcharge or discount
• Extra labour minutes
• Geo-Price Zone rule (e.g., inner-city surcharge)
• Conditional follow-up field (via OctopusPro “Add conditional field”)

This mirrors “derived” or “dynamic” pricing models used by Booking.com and other SaaS booking engines.

2 . Where can I use it?

• Services & bookings – one-tap selection that can change price or duration in real-time (e.g., “Vehicle type”: Compact, SUV + $30, Pickup + $50).
• Inquiry widget – pre-qualify leads with a single visible question (e.g., “Event type”: Wedding / Corporate / Birthday).
• Customer profile – store lasting preferences such as “Preferred contact method” (Email / SMS / Phone).
• Fieldworker profile – flag a primary qualification, e.g., “Certification level” (Apprentice / Journeyman / Master) so schedulers filter by skill.
• For Forms & Checklists – Button Groups in Forms & Checklists collect single-choice answers without affecting price or duration. To create one:
  1. Go to Settings ▸ General Settings ▸ Forms & Checklists.
  2. Click Create New to create a new Form. Or edit an existing Form.
  3. Click Create New Field.
  4. Give it a label (e.g. “Select safety level”), choose Field Type → Button Group, and define your options.
  5. Save.
  6. Embed the form or checklist wherever you need—questions render as tappable buttons, but they do not trigger any surcharge or extra time.

  This lets you reuse the same intuitive button-group UI for on-job inspections, compliance checklists, or any multi-step form outside of bookings—capturing neat, single-choice responses without pricing logic.

3 . Step-by-step setup

1. Settings ▸ Service Settings ▸ Custom Fields ▸ Create New.
2. Label your question (Select vehicle type).
3. Choose Field Type → Single Choice Button Display (Button Group).
4. Enter each option: title, optional thumbnail, price/time rules, Geo-Zone, dependent field.
5. Pick a display order (as entered, price ascending, price descending, alphabetical).
6. Select an optional default button.
7. Save and attach to a service, inquiry form, customer profile, or fieldworker profile. (Customer/Fieldworker paths start in Settings ▸ General Settings).

4 . How users interact

Role	Create / Edit	View
Admin (web)	Click one button; quote/ETA recalculates instantly.	Selected button name appears in booking details and invoices.
Fieldworker (app)	Tap a button during booking creation or update.	See the chosen option in the job card.
Customer (portal/widget)	One tap during checkout; live total updates.	Option shows in confirmation & “My bookings”.

Accessible focus rings and proper ARIA roles ensure keyboard and screen-reader usability.

5 . Reporting & filters

Because the value is stored as a single token, you can:

• Filter bookings: Event type = Wedding.
• Segment customers: Contact method = SMS.
• Report revenue by option: total sales for “SUV” detailing.

Button groups provide cleaner analytics than free-text fields and faster entry than dropdowns, matching UX and BI best practices.

6 . Example pricing scenarios

Service	Field & options	Price / time rule
Auto detailing	Vehicle type: Compact / SUV (+$30, +20 min) / Pickup (+$50, +30 min)	Derived per option
Catering	Event package: Silver / Gold (+15 %) / Platinum (+25 %)	Percentage surcharge
Cleaning	Carpet fibre: Nylon / Wool (+$2 m²)	Per-unit surcharge
IT support	Response SLA: Next-day / 4 hr (+$75) / 1 hr (+$150)	Flat fee

7 . Key benefits

• Visual clarity—all choices visible, no dropdown hunt.
• Touch-friendly—large hit areas match Material segmented-button specs.
• Real-time pricing—mirrors e-commerce derived pricing, reducing bill shock.
• Accessible—ARIA role=”radiogroup” + label meets W3C guidelines.
• Consistent analytics—single token per booking fuels reliable reports.

To stay updated, please subscribe to our YouTube channel.