#84 - Clear Inputs OnLoad v0.1

Add this script to any page to clear the value of a custom field on page load.


<!-- 💙 MEMBERSCRIPT #84 v0.1 💙 CLEAR INPUT VALUES ONLOAD -->
<script>
  document.addEventListener('DOMContentLoaded', async function() {
    const memberstack = window.$memberstackDom;
    const fieldsToClear = ["phone", "last-name"]; // Specify the fields to clear

    // Clear inputs and Memberstack fields on page load
    memberstack.getCurrentMember().then(async ({ data: member }) => {
      if (member) {
        const customFieldsToUpdate = {};
      
        fieldsToClear.forEach(fieldName => {
          customFieldsToUpdate[fieldName] = '';
        });

        try {
          await memberstack.updateMember({
            customFields: customFieldsToUpdate
          });
          console.log("Fields cleared on page load.");
        } catch (error) {
          console.error('Error clearing fields on page load:', error);
        }
      }
      
      // Clear input values on page load for specified fields
      fieldsToClear.forEach(fieldName => {
        const inputField = document.querySelector(`[data-ms-member="${fieldName}"]`);
        if (inputField) {
          inputField.value = '';
        }
      });
    });
  });
</script>

Creating the Make.com Scenario

1. Download the JSON blueprint below to get stated.

Download File

2. Navigate to Make.com and Create a New Scenario...

3. Click the small box with 3 dots and then Import Blueprint...

4. Upload your file and voila! You're ready to link your own accounts.

Need help with this MemberScript?

All Memberstack customers can ask for assistance in the 2.0 Slack. Please note that these are not official features and support cannot be guaranteed.

Join the 2.0 Slack

Version notes

Attributes

Description

Attribute

No items found.

Guide

How to Force Clear form Inputs on Page Load in Webflow

Memberscripts needed

‍https://www.memberstack.com/scripts/84-clear-inputs-onload

Tutorial

Cloneable

This guide will help you set up forms whose fields get cleared when the page is refreshed.

Once a member submits a form, the member data gets updated in Memberstack. Then, when the page is refreshed, the form fields are cleared and the data is removed from Memberstack as well.

Forcing clear form inputs on page load in Webflow

To force the clearing of form inputs on a page in Webflow, we’re going to use MemberScript #84 – Clear Inputs on Load. Follow the link to get the code you’ll need to add to your page and watch a video tutorial on how to set everything up.

Setting it up and making it work

The first thing you’ll need to do is create your form and style it however you want.

Now that you’ve got your form set up, all you need to do is add the MemberScript #84 custom code to your page, before the closing body tag.

In our custom code, you might want to edit the IDs of the fields that you want cleared on page refresh. You can do that by adding or removing form field IDs under fieldsToClear.

A screen shot of a computerDescription automatically generated

Conclusion

That’s everything, you can now go ahead and test the form on your live site.

If you want to use our demo project to get you started, just click the button below to add it to your Webflow site.

Our demo can help you easily set up a form with input fields that get cleared on page load.

Take me to the Scripts

Read full guide

Tutorial

Button Text

#84 - Clear Inputs OnLoad v0.1

Creating the Make.com Scenario

Need help with this MemberScript?

How to Force Clear form Inputs on Page Load in Webflow

Memberscripts needed

Tutorial

Cloneable

Forcing clear form inputs on page load in Webflow

Setting it up and making it work

Conclusion

Take me to the Scripts

Try Memberstack for free

Product

Language

Customers

Company

Resources

Something not working as expected?