How can we help?

Note: Validating API keys isn’t directly supported in FramerForms. However, for special use cases, it can be achieved by modifying the code. Be cautious when editing code and do it only if necessary.

Access Form Components:

• Open your FramerForms project.

Unlink Form Components:

• To modify code, double click on the component

• Unlink the form components. This can be done by selecting "Unlink instances".

Locate "isValid" Function:

• Navigate to the codebase, specifically the FormField.tsx file

Understand the "isValid" Function:

• This function runs on every field when the submit button is pressed.

• It currently checks if the field is required, has a value, and if the value is valid.

Modify the "isValid" Function:

• Edit the "Valid" function to include a check for the validity of the API key.

• Add logic to return false if the API key is not valid.

Proceed with Caution:

• Be aware that modifying code, especially for validation checks, should be done with caution.

• Ensure that your changes align with the security and integrity of the form.

Testing:

• After making changes, thoroughly test the form to ensure it functions as expected with the new API key validation.