Checkboxes and radio buttons are particularly tricky input types to work with, but a quick read through this article will clear things up.

As you probably noticed, Memberstack treats all custom fields equally. However, if your website builder supports data attributes we have a workaround for you.

Note: If your checkboxes or radio buttons do not appear to be working, make sure your CSS is correct. Some custom checkboxes and radio buttons have to be clicked on to show any changes.

Checkboxes

1. Add a checkbox to your site. 

Setup your checkbox field exactly as you would for any other form.

2. Add a new field to Memberstack for each checkbox.

Click Add custom fields on the Forms & Fields page. After that, select the field and click the Hide from profile toggle so members can't make free-form edits.

3. Add the attribute to your input field.

Save it, and you're ready to test! Memberstack will record true or false and save that to the member's profile. If the member checks the box and reloads the page, Memberstack will remember and automatically check the box for them.

A few things to remember:

  • The data-ms-member attribute has to go on the actual <input>. In most site builders, this is the actual checkbox and not the label or element wrapper.
  • Memberstack will record true or false, so be sure to name your checkbox something descriptive.

Radio buttons

Radio buttons let a user select only one of a limited number of choices and give you have more design control.

1. Add a group of radio buttons to your site. 

Setup your radio button fields exactly as you would for any other form.

2. Add a single custom field to Memberstack for each radio group.

Click Add custom fields on the forms page. After that, select the field and click the Hide from profile toggle button so members can't make free-form edits.

3. Add the same attribute to every <input> in the group.

Save it, and you're ready to test! Memberstack will record the value of the selected radio button, and save that to the member's profile. If a member checks a radio option and reloads the page, Memberstack will remember and automatically check that same radio button.

A few things to remember:

  • The data-ms-member attribute has to go on the actual <input>. In most site builders, this is the actual radio button and not the label or element wrapper.
Did this answer your question?