[Feature Request] Disable changing pre-filled email address

[watadarkstar]

Why

We don't want our users to change the pre-filled email address. I'm not sure if this is possible. Let me know if it is or isn't.

Example

<InlineWidget
            styles={{
              height: "850px",
              position: "relative",
              bottom: "60px",
            }}
            prefill={{
               email: { value: "[email protected]", disabled: true }
            }}
            url={calendlyUrl}
            pageSettings={calendlyPageSettings}
          />

[tcampb]

@watadarkstar - the Calendly embed api does not currently provide a way to disable any of the inputs on the scheduling page.

One option would be to store the original email address as a utm parameter, for example:

<InlineWidget
            styles={{
              height: "850px",
              position: "relative",
              bottom: "60px",
            }}
            url={calendlyUrl}
            pageSettings={calendlyPageSettings}
            utm={{ utmContent: "[email protected]" }}
          />

This provides an easier way to track the user that scheduled as the utm parameter value can only be changed in the url and not in the scheduling form.

[watadarkstar]

@tcampb Thanks for the suggestion!

Is there a way to validate that the email they entered is the same one the application passed as a prefill?

For example by adding a check in a callback method?

useCalendlyEventListener({
    onEmailChanged: (email) => if (prefill.email !== email) alert("The email cannot be changed"),
  });

[tcampb]

@watadarkstar - the embed api events don't currently support notifying the parent window of any changes within the scheduling form; as a result, we wouldn't be able to detect if any of the field values changed during the scheduling process.

[watadarkstar]

Closing since there is no way to do this :(

[doublejosh]

You could...

• capture the data.payload with the onEventScheduled event listener
• send the API endpoints it gives you to your own cloud function (or active server) endpoint
• use a token and the endpoints to fetch the user data
• send a reply to the client with your validation

It's very ridiculous that the embed doesn't share the form submission data with the client... but the above is the horrific workaround.