Advanced forms

Toggle Count

The Toggle Count Component simplifies switching between different values, aiding comparison and decision-making on pricing pages.

Basic example

With radio

Basic example of toggle count with radio input.

Free

$

0

All the basics for the business that are just getting started!

Essential

$

15

All the essentials for the business that need some added support!

Standard

$

60

All the standards for the businesses that need more growth.

Pro

$

100

All the advanced features with pro support & customizations!

With switch

Basic example of toggle count with switch(checkbox) input.

Free

$

0

All the basics for the business that are just getting started!

Essential

$

15

All the essentials for the business that need some added support!

Standard

$

60

All the standards for the businesses that need more growth.

Pro

$

100

All the advanced features with pro support & customizations!

Illustrations

Pricing cards

Basic example demonstrates use of toggle count in pricing cards.

Basic

A simple start for everyone

$ 3
  • 100 responses a month
  • Unlimited forms & surveys
  • Unlimited fields
  • Basic form creation tools
  • Up to 2 subdomains
Popular
Standard

For small to medium businesses

$ 15
  • Unlimited responses
  • Unlimited forms & surveys
  • Instagram profile page
  • Google Docs integration
  • Custom Landing page
Enterprise

Solution for big organizations

$ 79
  • PayPal payments
  • Logic Jumps
  • File upload with 5GB storage
  • Custom domain support
  • Stripe integration

Destroy/Reinitialize

The `destroy` <a href="#destroy-method" class="link link-primary">method</a> is provided to facilitate the destruction of a toggle count.

Free

$

0

All the basics for the business that are just getting started!

Essential

$

15

All the essentials for the business that need some added support!

Standard

$

60

All the standards for the businesses that need more growth.

Pro

$

100

All the advanced features with pro support & customizations!

Options usage

Duration

Assign the value of the `data-toggle-count` attribute as an object. Within this object, set the `duration` option to `number` to set counting speed(animation). By default, its value is `700`.

10

JavaScript behavior

Methods — Method usage

The `HSToggleCount` object is contained within the global `window` object.

10

JavaScript
const { element } = HSToggleCount.getInstance('#toggle-count-destroy', true);
const destroyBtn = document.querySelector('#destroy-btn');

destroyBtn.addEventListener('click', () => {
  element.destroy();
});
Class referenceThe component, style, color, state, size and modifier classes available for this component.
ClassTypeDescription
switchcomponentComponent class for switch.