CorvidReference

RsvpForm

A form for creating an RSVP to an event.

Using an RsvpForm, you can build custom RSVP experiences for your events.

You will need to have at least one existing event to create an RsvpForm.

Typical Custom RSVP Form Lifecycle

  1. In the Dashboard, set up a registration form for an event.
  2. Retrieve the ID of an event from the Events/Events collection.
  3. Create a new RsvpForm using the createEventRsvpForm() function with the ID retrieved above.
  4. Retrieve information about the RSVP form inputs in the form using the getRsvpData() function.
  5. In the Editor, add user inputs elements for each form inputs retrieved above. You may want to set the elements IDs to match the names of form inputs retrieved above.
  6. In the Editor, add a button that will be used to submit the form value to create a new RSVP.
  7. When the submit button is clicked, gather the values entered into the form in a FormValue array and use the submit() function to submit the values.

Table of Contents

FUNCTIONS

?
Perform actions on an object.
getRsvpData( )Gets information about the event's RSVP form and status.
submit( )Submits an RSVP form and adds the new guests to the event's guest list.
validate( )Validates form fields and values against the registration form as defined in the site Dashboard.
validateInput( )Validates an input form field value against the registration form as defined in the site Dashboard.

OBJECTS

?
Objects used when setting, getting, or calling the properties and methods listed above.
AdditionalLabelAn object containing information about a label for a complex input field type.
FieldValidationErrorAn object representing an error that occurred during validation of an RSVP form's fields.
FormValueAn object containing information about form value to submit.
GuestAn object representing a guest on an event RSVP.
InputValueAn object representing a submitted RSVP form input value.
RsvpDataAn object representing the details needed to create an RSVP form for an event.
RsvpFormAn object representing a submitted RSVP form.
RsvpInputItemAn object containing information about an input field in an RSVP form.
RsvpResponseAn object representing a response to submitting an RSVP.
SubmissionErrorAn object representing an error that occurred during an RSVP form submission.
ValidationResultAn object representing the result of a form validation.
ValueValidationErrorAn object representing an error that occurred during validation of an RSVP form's values.

getRsvpData( )

Gets information about the event's RSVP form and status.

Description

The getRsvpData() function returns a Promise that resolves to an RsvpData object containing all the information you need to create a custom RSVP form for the specified event.

This information includes:

  • The event's registration status, such as whether registration is open, closed, or guests will be placed on a waitlist.
  • Which statuses guests can RSVP with, such as yes, no, or to be added to the waitlist.
  • Information about the RSVP form's fields, such as their names, descriptive labels, and whether they are required.

Note

To work with the Wix Events API, you need to publish your site.

Syntax

function getRsvpData(): Promise<RsvpData>
RETURN VALUE
?
Value that a function evaluates to when it is finished running.
Promise<RsvpData>
Fulfilled - Information about the RSVP form's input fields and status options.

Examples

Get an RSVP form's information

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId)

form.getRsvpData()
  .then( (rsvpData) => {
    let fields = rsvpData.rsvpFormInputs;
    let firstFieldName = fields[0].name;
    let statusOptions = rsvpData.rsvpStatusOptions;
    let registrationStatus = rsvpData.registrationStatus;
  } );

/*  rsvpData:
 *
 *  {
 *    "rsvpStatusOptions": "YES_AND_NO,
 *    "registrationStatus": "OPEN_RSVP",
 *    "rsvpFormInputs": [
 *      {
 *        "_id": "37a5789b-27d1-43a3-703b-a93dedad5b01",
 *        "additionalLabels": [],
 *        "array": false,
 *        "controlType": "NAME",
 *        "label": "First Name",
 *        "required": true,
 *        "maxLength": 50,
 *        "name": "firstName",
 *        "options": []
 *      },
 *  
 *      ...
 *  
 *      {
 *        "_id": "27d5789b-137a-43ed-a33d-a9703bad5b01",
 *        "additionalLabels": [
 *          {
 *            "name": "one",
 *            "label": "I'm bringing a plus one"
 *          },
 *          {
 *            "name": "multiple",
 *            "label": "Additional Guests"
 *          }
 *        ],
 *        "array": false,
 *        "controlType": "GUEST_CONTROL",
 *        "label": "I'm bringing a plus one",
 *        "required": true,
 *        "maxLength": 0,
 *        "name": "additionalGuests",
 *        "options": [
 *          "0",
 *          "1"
 *        ]
 *      }
 *    ]
 *  }
 */

Create and submit an RSVP form

This example assumes that a form is built with input elements, where the element IDs match the field names retrieved from the getRsvpData() function.

import wixEvents from 'wix-events';
import wixData from 'wix-data';

let form;
let rsvpData;

// Run a query that will return only one event. Add
// additional filtering to the query if necessary.
wixData.query("Events/Events")
  .eq("title", "My Event")
  .find()
  .then( (results) => {
    if(results.items.length > 0) {
      form = wixEvents.createEventRsvpForm(results.items[0]._id);
      form.getRsvpData()
        .then(response => {
          rsvpData = response;
        });
    }
    else {
      console.log("Could not find event");
    }
  });

$w.onReady(function () {
  $w('#submit').onClick( () => {
    let formValues = getFormValues();

    form.submit(formValues)
      .then( (result) => {
        console.log("RSVP form submitted.")
      } )
      .catch( (error) => {
        console.log(`Error message: ${error.message}`);
        if(error.fields) {
          console.log(`Incorrect fields: ${error.fields}`);  
        }
      } );	
  } );
});

function getFormValues() {
  const formValues = [{"name": "rsvpStatus", "value": "YES"}];
    
  rsvpData.rsvpFormInputs.forEach( (item) => {
    formValues.push(
      {
        "name": [item.name],
        "value": $w(`#${item.name}`).value
      }
    );
  } );

  // When the form contains an address or additional
  // guests, add code to add those values to formValues.

  return formValues;
}

submit( )

Submits an RSVP form and adds the new guests to the event's guest list.

Description

The submit() function returns a Promise that resolves to an RsvpResponse when the guests in the specified form values have been added to the event's guest list.

The list of FormValue objects you pass to submit() must include a form value for the rsvpStatus. Which statuses you can return depends on the rsvpStatusOptions returned from the getRsvpData() function as follows:

  • "YES_AND_NO": Send an rsvpStatus of "YES" or "NO".
  • "YES_ONLY": Send an rsvpStatus of "YES".
  • "OPEN_RSVP_WAITLIST": Send an rsvpStatus of "WAITING" to add a guest to the waitlist.

When submitting an RSVP form with rsvpStatus of "WAITING" or "NO", the list of FormValue objects should only contain items for "firstName", "lastName", "email", and "rsvpStatus". No other fields should be passed.

When a form contains an input for adding more guests to an RSVP, format the guest names for submission in an array where each element is the full name of a guest.

When a form contains an address, the way you format the address information for submission depends on what type of input elements you use to gather that information as follows:

  • If the address is input using a Wix address input element, no special formatting is needed.
  • If the address is input using another type of input element, such as a text input, format the input's value in an array.
  • If the address is input using a number of input elements, each for a different part of the address, format the input values as elements in an array.

Note

To work with the Wix Events API, you need to publish your site.

Syntax

function submit(formValues: Array<FormValue>): Promise<RsvpResponse>
PARAMETERS
?
Values that you pass to a function.
formValues
Array<FormValue>
List of field names and values for an RSVP form.

Examples

Submit an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.submit(formValues)
  .then( (response) => {
    let totalGuests = response.totalGuests; // 2
    let firstGuestName = response.guests[0].fullName; // Jane Doe
  } )
  .catch( (error) => {
    let message = error.message; // "Guest limit exceeded: only 1 person can RSVP"
    let errorType = error.errorType; // "GUEST_LIMIT_REACHED"
  });

/*
 * Success response:
 * {
 *   "anonymized": false,
 *   "contactId": "f1b9e9b3-5acb-4f15-ada8-e31a34a376ec",
 *   "createdDate": "2019-09-02T12:29:34.944Z",
 *   "email": "john.doe@somedomain.com",
 *   "eventId": "caad2acf-5c64-4eab-97f8-6710feac9151",
 *   "firstName": "John",
 *   "lastName": "Doe",
 *   "guests": [
 *     {
 *       "index": 0, 
 *       "fullName": "John Doe", 
 *       "id": 1
 *     }
 *   ],
 *   "id": "c71fc4d1-661e-473c-8b8c-74d97cf91b22",
 *   "memberId": "",
 *   "updatedDate": "2019-09-02T12:29:34.944Z",
 *   "rsvpForm": {
 *     "inputValues": [
 *       {
 *         "inputName": "firstName",
 *         "value": "John",
 *         "values": [],
 *       },
 * 
 *       ...
 * 
 *       {
 *         inputName: "custom",
 *         value: "",
 *         values: ["Gluten free", "Vegetarian"],
 *       }
 *     ]
 *   },
 *   "status": "YES"
 *   "totalGuests": 1
 * }
 */

Create and submit an RSVP form

import wixEvents from 'wix-events';
import wixData from 'wix-data';

let form;

// Run a query that will return only one event. Add
// additional filtering to the query if necessary.
wixData.query("Events/Events")
  .eq("title", "My Event")
  .find()
  .then( (results) => {
    if(results.items.length > 0) {
      form = wixEvents.createEventRsvpForm(results.items[0]._id);
    }
    else {
      console.log("Could not find event");
    }
  });

$w.onReady(function () {
  $w("#submit").onClick( () => {
    const formValues = getFormValues();

    form.submit(formValues)
      .then( (result) => {
        console.log("RSVP form submitted.")
      } )
      .catch( (error) => {
        console.log(`Error message: ${error.message}`);
        if(error.fields) {
          console.log(`Incorrect fields: ${error.fields}`);  
        }
      } );	
  } );
});

function getFormValues() {
  return [
    {"name": "rsvpStatus", "value": "YES"},
    {"name": "firstName", "value": $w("#firstName").value},
    {"name": "lastName", "value": $w("#lastName").value},
    {"name": "email", "value": $w("#email").value},
    {"name": "custom", "value": $w("#foodAllergies").value},

    // When a form contains an address, the way you format the
    // address information for submission depends on what type
    // of input elements you use to gather that information.

    // Wix address input element.
    {"name": "address", "value": $w("#address").value},

    // Single element which is not an address
    // input element, such as a text input.
    {"name": "address", "value": [$w("#address").value]},

    // Multiple elements for the
    // various parts of an address.
    {
      "name": "address", 
      "value": [
        $w("#street").value,
        $w("#city").value,
        $w("#state").value,
        $w("#country").value,
        $w("#postalCode").value
      ]
    },

    // When a form contains an input for adding more guests to an
    // RSVP, format the guest names for submission in an array
    // where each element is the full name of a guest.
    {"name": "additionalGuests", "value": $w('#additionalGuests').value},
    {
      "name": "guestNames",
      "value": [
        `${$w("#guest1FirstName").value} ${$w("#guest1LastName").value}`,
        `${$w("#guest2FirstName").value} ${$w("#guest2LastName").value}`,
      ]
    }
  ];
}

validate( )

Validates form fields and values against the registration form as defined in the site Dashboard.

Description

The validate() function returns a Promise that resolves to {valid: true} if the fields and values in the RSVP form are valid or rejects if there are invalid fields or values.

You can validate your form explicitly using the validate() function. Validation is also implicitly performed when you call the submit() function. When the validate() function is called, explicitly or implicitly, the validateInput() function also runs for all your form fields.

The following are invalid when checked against the event's registration form as defined in the site Dashboard:

  • The specified form values contain a field that does not exist in the event's registration form.
  • The specified form values are missing a field that exists in the event's registration form. You must also include non-required fields even if their values are empty.

Note

To work with the Wix Events API, you need to publish your site.

Syntax

function validate(formValues: Array<FormValue>): Promise<ValidationResult>
PARAMETERS
?
Values that you pass to a function.
formValues
Array<FormValue>
Field names and values for an RSVP form.
RETURN VALUE
?
Value that a function evaluates to when it is finished running.

Fulfilled - Validation result when validation passes. Rejected - FieldValidationError when validation fails.

Examples

Validate an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.validate(formValues)
  .then( (response) => {
    // handle case where form is valid
  } )
  .catch( (error) => {
    // handle case where form is not valid
    let message = error.message; // "Following fields have invalid IDs: nonExistent1, nonExistent2"
    let fields = error.fields; // ["nonExistent1", "nonExistent2"]
  });

validateInput( )

Validates an input form field value against the registration form as defined in the site Dashboard.

Description

The validateInput() function returns a Promise that resolves to {valid: true} if the value in the specified field is valid or rejects if it is not valid.

You can validate your form's values explicitly using the validateInput() function. Value validation is also implicitly performed when you call the submit() function or the validate() function.

You may want to call the validateInput() function in an input element's onCustomValidation() event handler to validate an input while the form is being filled out.

Note

To work with the Wix Events API, you need to publish your site.

Syntax

function validateInput(inputName: string, formValues: Array<FormValue>): Promise<ValidationResult>
PARAMETERS
?
Values that you pass to a function.
inputName
string
Name of the input field to validate.
formValues
Array<FormValue>
Field names and values for an RSVP form.
RETURN VALUE
?
Value that a function evaluates to when it is finished running.

Fulfilled - Validation result when validation passes. Rejected - ValueValidationError when validation fails.

Examples

Validate an RSVP form value

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.validateInput("firstName", formValues)
  .then( (response) => {
    // handle case where firstName is valid
  } )
  .catch( (error) => {
    // handle case where firstName is not valid
    let message = error.message; // "First Name is required"
    let type = error.errorType; // "EMPTY_INPUT"
    let inputId = error.inputId; // firstName
  });

Validate a form value in an element's onCustomValidation() handler

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

$w("#firstName").onCustomValidation( (value, reject) => {
  eventRsvpForm.validateInput("firstName", getFormValues())
    .catch(err => {
      let message = error.message; // "First Name is required"
      let type = error.errorType; // "EMPTY_INPUT"
      let inputId = error.inputId; // firstName
    } );
} );

Create and submit an RSVP form

import wixEvents from 'wix-events';
import wixData from 'wix-data';

let form;

// Run a query that will return only one event. Add
// additional filtering to the query if necessary.
wixData.query("Events/Events")
  .eq("title", "My Event")
  .find()
  .then( (results) => {
    if(results.items.length > 0) {
      form = wixEvents.createEventRsvpForm(results.items[0]._id);
    }
    else {
      console.log("Could not find event");
    }
  });

$w.onReady(function () {
  $w("#submit").onClick( () => {
    const formValues = getFormValues();

    form.submit(formValues)
      .then( (result) => {
        console.log("RSVP form submitted.")
      } )
      .catch( (error) => {
        console.log(`Error message: ${error.message}`);
        if(error.fields) {
          console.log(`Incorrect fields: ${error.fields}`);  
        }
      } );	
  } );
});

function getFormValues() {
  return [
    {"name": "rsvpStatus", "value": "YES"},
    {"name": "firstName", "value": $w("#firstName").value},
    {"name": "lastName", "value": $w("#lastName").value},
    {"name": "email", "value": $w("#email").value},
    {"name": "custom", "value": $w("#foodAllergies").value},

    // When a form contains an address, the way you format the
    // address information for submission depends on what type
    // of input elements you use to gather that information.

    // Wix address input element.
    {"name": "address", "value": $w("#address").value},

    // Single element which is not an address
    // input element, such as a text input.
    {"name": "address", "value": [$w("#address").value]},

    // Multiple elements for the
    // various parts of an address.
    {
      "name": "address", 
      "value": [
        $w("#street").value,
        $w("#city").value,
        $w("#state").value,
        $w("#country").value,
        $w("#postalCode").value
      ]
    },

    // When a form contains an input for adding more guests to an
    // RSVP, format the guest names for submission in an array
    // where each element is the full name of a guest.
    {"name": "additionalGuests", "value": $w('#additionalGuests').value},
    {
      "name": "guestNames",
      "value": [
        `${$w("#guest1FirstName").value} ${$w("#guest1LastName").value}`,
        `${$w("#guest2FirstName").value} ${$w("#guest2LastName").value}`,
      ]
    }
  ];
}

AdditionalLabel

An object containing information about a label for a complex input field type.

See Also

getRsvpData( )

Syntax

type AdditionalLabel = {
  name: string
  label: string
}
MEMBERS
?
The properties of an object.
name
string
Additional label name.
label
string
Additional label value.

Examples

Get RSVP form data

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId)

form.getRsvpData()
  .then( (rsvpData) => {
    let fields = rsvpData.rsvpFormInputs;
    let firstFieldName = fields[0].name;
    let statusOptions = rsvpData.rsvpStatusOptions;
    let registrationStatus = rsvpData.registrationStatus;
  } );

/*  rsvpData:
 *
 *  {
 *    "rsvpStatusOptions": "YES_AND_NO,
 *    "registrationStatus": "OPEN_RSVP",
 *    "rsvpFormInputs": [
 *      {
 *        "_id": "37a5789b-27d1-43a3-703b-a93dedad5b01",
 *        "additionalLabels": [],
 *        "array": false,
 *        "controlType": "NAME",
 *        "label": "First Name",
 *        "required": true,
 *        "maxLength": 50,
 *        "name": "firstName",
 *        "options": []
 *      },
 *  
 *      ...
 *  
 *      {
 *        "_id": "27d5789b-137a-43ed-a33d-a9703bad5b01",
 *        "additionalLabels": [
 *          {
 *            "name": "one",
 *            "label": "I'm bringing a plus one"
 *          },
 *          {
 *            "name": "multiple",
 *            "label": "Additional Guests"
 *          }
 *        ],
 *        "array": false,
 *        "controlType": "GUEST_CONTROL",
 *        "label": "I'm bringing a plus one",
 *        "required": true,
 *        "maxLength": 0,
 *        "name": "additionalGuests",
 *        "options": [
 *          "0",
 *          "1"
 *        ]
 *      }
 *    ]
 *  }
 */

FieldValidationError

An object representing an error that occurred during validation of an RSVP form's fields.

See Also

validate( ), submit( )

Syntax

type FieldValidationError = {
  message: string
  fields: Array<string>
}
MEMBERS
?
The properties of an object.
message
string
Error message.
fields
Array<string>
List of fields that caused the error when the form does not pass validation.

Examples

Validate an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.validate(formValues)
  .then( (response) => {
    // handle case where form is valid
  } )
  .catch( (error) => {
    // handle case where form is not valid
    let message = error.message; // "Following fields have invalid IDs: nonExistent1, nonExistent2"
    let fields = error.fields; // ["nonExistent1", "nonExistent2"]
  });

FormValue

An object containing information about form value to submit.

See Also

submit( ), validate( ), validateInput( )

Syntax

type FormValue = {
  name: string
  value: string
}
MEMBERS
?
The properties of an object.
name
string
Form field name.
value
string
Form field value.

Examples

Create and submit an RSVP form

import wixEvents from 'wix-events';
import wixData from 'wix-data';

let form;

// Run a query that will return only one event. Add
// additional filtering to the query if necessary.
wixData.query("Events/Events")
  .eq("title", "My Event")
  .find()
  .then( (results) => {
    if(results.items.length > 0) {
      form = wixEvents.createEventRsvpForm(results.items[0]._id);
    }
    else {
      console.log("Could not find event");
    }
  });

$w.onReady(function () {
  $w("#submit").onClick( () => {
    const formValues = getFormValues();

    form.submit(formValues)
      .then( (result) => {
        console.log("RSVP form submitted.")
      } )
      .catch( (error) => {
        console.log(`Error message: ${error.message}`);
        if(error.fields) {
          console.log(`Incorrect fields: ${error.fields}`);  
        }
      } );	
  } );
});

function getFormValues() {
  return [
    {"name": "rsvpStatus", "value": "YES"},
    {"name": "firstName", "value": $w("#firstName").value},
    {"name": "lastName", "value": $w("#lastName").value},
    {"name": "email", "value": $w("#email").value},
    {"name": "custom", "value": $w("#foodAllergies").value},

    // When a form contains an address, the way you format the
    // address information for submission depends on what type
    // of input elements you use to gather that information.

    // Wix address input element.
    {"name": "address", "value": $w("#address").value},

    // Single element which is not an address
    // input element, such as a text input.
    {"name": "address", "value": [$w("#address").value]},

    // Multiple elements for the
    // various parts of an address.
    {
      "name": "address", 
      "value": [
        $w("#street").value,
        $w("#city").value,
        $w("#state").value,
        $w("#country").value,
        $w("#postalCode").value
      ]
    },

    // When a form contains an input for adding more guests to an
    // RSVP, format the guest names for submission in an array
    // where each element is the full name of a guest.
    {"name": "additionalGuests", "value": $w('#additionalGuests').value},
    {
      "name": "guestNames",
      "value": [
        `${$w("#guest1FirstName").value} ${$w("#guest1LastName").value}`,
        `${$w("#guest2FirstName").value} ${$w("#guest2LastName").value}`,
      ]
    }
  ];
}

Guest

An object representing a guest on an event RSVP.

See Also

submit( )

Syntax

type Guest = {
  index: number
  id: number
  fullName: string
}
MEMBERS
?
The properties of an object.
index
number
Index of the guest in the RSVP guest list. Indices are zero-based.
id
number
Guest ID, which is unique within the RSVP.
fullName
string
Full name of the guest

Examples

Submit an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.submit(formValues)
  .then( (response) => {
    let totalGuests = response.totalGuests; // 2
    let firstGuestName = response.guests[0].fullName; // Jane Doe
  } )
  .catch( (error) => {
    let message = error.message; // "Guest limit exceeded: only 1 person can RSVP"
    let errorType = error.errorType; // "GUEST_LIMIT_REACHED"
  });

/*
 * Success response:
 * {
 *   "anonymized": false,
 *   "contactId": "f1b9e9b3-5acb-4f15-ada8-e31a34a376ec",
 *   "createdDate": "2019-09-02T12:29:34.944Z",
 *   "email": "john.doe@somedomain.com",
 *   "eventId": "caad2acf-5c64-4eab-97f8-6710feac9151",
 *   "firstName": "John",
 *   "lastName": "Doe",
 *   "guests": [
 *     {
 *       "index": 0, 
 *       "fullName": "John Doe", 
 *       "id": 1
 *     }
 *   ],
 *   "id": "c71fc4d1-661e-473c-8b8c-74d97cf91b22",
 *   "memberId": "",
 *   "updatedDate": "2019-09-02T12:29:34.944Z",
 *   "rsvpForm": {
 *     "inputValues": [
 *       {
 *         "inputName": "firstName",
 *         "value": "John",
 *         "values": [],
 *       },
 * 
 *       ...
 * 
 *       {
 *         inputName: "custom",
 *         value: "",
 *         values: ["Gluten free", "Vegetarian"],
 *       }
 *     ]
 *   },
 *   "status": "YES"
 *   "totalGuests": 1
 * }
 */

InputValue

An object representing a submitted RSVP form input value.

See Also

submit( )

Syntax

type InputValue = {
  inputName: string
  value: string
  values: Array<string>
}
MEMBERS
?
The properties of an object.
inputName
string
Name of the form input.
value
string
Value of the form input, when there is just one value.
values
Array<string>
Value of the form input, when there are multiple values.

Examples

Submit an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.submit(formValues)
  .then( (response) => {
    let totalGuests = response.totalGuests; // 2
    let firstGuestName = response.guests[0].fullName; // Jane Doe
  } )
  .catch( (error) => {
    let message = error.message; // "Guest limit exceeded: only 1 person can RSVP"
    let errorType = error.errorType; // "GUEST_LIMIT_REACHED"
  });

/*
 * Success response:
 * {
 *   "anonymized": false,
 *   "contactId": "f1b9e9b3-5acb-4f15-ada8-e31a34a376ec",
 *   "createdDate": "2019-09-02T12:29:34.944Z",
 *   "email": "john.doe@somedomain.com",
 *   "eventId": "caad2acf-5c64-4eab-97f8-6710feac9151",
 *   "firstName": "John",
 *   "lastName": "Doe",
 *   "guests": [
 *     {
 *       "index": 0, 
 *       "fullName": "John Doe", 
 *       "id": 1
 *     }
 *   ],
 *   "id": "c71fc4d1-661e-473c-8b8c-74d97cf91b22",
 *   "memberId": "",
 *   "updatedDate": "2019-09-02T12:29:34.944Z",
 *   "rsvpForm": {
 *     "inputValues": [
 *       {
 *         "inputName": "firstName",
 *         "value": "John",
 *         "values": [],
 *       },
 * 
 *       ...
 * 
 *       {
 *         inputName: "custom",
 *         value: "",
 *         values: ["Gluten free", "Vegetarian"],
 *       }
 *     ]
 *   },
 *   "status": "YES"
 *   "totalGuests": 1
 * }
 */

RsvpData

An object representing the details needed to create an RSVP form for an event.

See Also

getRsvpData( )

Syntax

type RsvpData = {
  rsvpFormInputs: Array<RsvpInputItem>
  rsvpStatusOptions: string
  registrationStatus: string
}
MEMBERS
?
The properties of an object.
rsvpFormInputs
Information about the input fields needed to create an RSVP form.
rsvpStatusOptions
string

Allowed RSVP statuses for an event. One of:

  • "YES_AND_NO": Guests can RSVP for the event with a "Yes" or "No".
  • "YES_ONLY": Guests can only RSVP for the event with a "Yes".
  • "WAITING": The guest limit has been reached, but there is an open waitlist.
registrationStatus
string

Event registration status. One of:

  • "OPEN_RSVP": Registration is open and guest limit has not been reached.
  • "OPEN_RSVP_WAITLIST": Registration is open, guest limit has been reached, and additional registering guests are added to the waitlist.
  • "CLOSED": Registration is closed because the guest limit has been reached.
  • "CLOSED_MANUALLY": Registration was closed manually.

Examples

Get RSVP form data

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId)

form.getRsvpData()
  .then( (rsvpData) => {
    let fields = rsvpData.rsvpFormInputs;
    let firstFieldName = fields[0].name;
    let statusOptions = rsvpData.rsvpStatusOptions;
    let registrationStatus = rsvpData.registrationStatus;
  } );

/*  rsvpData:
 *
 *  {
 *    "rsvpStatusOptions": "YES_AND_NO,
 *    "registrationStatus": "OPEN_RSVP",
 *    "rsvpFormInputs": [
 *      {
 *        "_id": "37a5789b-27d1-43a3-703b-a93dedad5b01",
 *        "additionalLabels": [],
 *        "array": false,
 *        "controlType": "NAME",
 *        "label": "First Name",
 *        "required": true,
 *        "maxLength": 50,
 *        "name": "firstName",
 *        "options": []
 *      },
 *  
 *      ...
 *  
 *      {
 *        "_id": "27d5789b-137a-43ed-a33d-a9703bad5b01",
 *        "additionalLabels": [
 *          {
 *            "name": "one",
 *            "label": "I'm bringing a plus one"
 *          },
 *          {
 *            "name": "multiple",
 *            "label": "Additional Guests"
 *          }
 *        ],
 *        "array": false,
 *        "controlType": "GUEST_CONTROL",
 *        "label": "I'm bringing a plus one",
 *        "required": true,
 *        "maxLength": 0,
 *        "name": "additionalGuests",
 *        "options": [
 *          "0",
 *          "1"
 *        ]
 *      }
 *    ]
 *  }
 */

Create and submit an RSVP form

This example assumes that a form is built with input elements, where the element IDs match the field names retrieved from the getRsvpData() function.

import wixEvents from 'wix-events';
import wixData from 'wix-data';

let form;
let rsvpData;

// Run a query that will return only one event. Add
// additional filtering to the query if necessary.
wixData.query("Events/Events")
  .eq("title", "My Event")
  .find()
  .then( (results) => {
    if(results.items.length > 0) {
      form = wixEvents.createEventRsvpForm(results.items[0]._id);
      form.getRsvpData()
        .then(response => {
          rsvpData = response;
        });
    }
    else {
      console.log("Could not find event");
    }
  });

$w.onReady(function () {
  $w('#submit').onClick( () => {
    let formValues = getFormValues();

    form.submit(formValues)
      .then( (result) => {
        console.log("RSVP form submitted.")
      } )
      .catch( (error) => {
        console.log(`Error message: ${error.message}`);
        if(error.fields) {
          console.log(`Incorrect fields: ${error.fields}`);  
        }
      } );	
  } );
});

function getFormValues() {
  const formValues = [{"name": "rsvpStatus", "value": "YES"}];
    
  rsvpData.rsvpFormInputs.forEach( (item) => {
    formValues.push(
      {
        "name": [item.name],
        "value": $w(`#${item.name}`).value
      }
    );
  } );

  // When the form contains an address or additional
  // guests, add code to add those values to formValues.

  return formValues;
}

RsvpForm

An object representing a submitted RSVP form.

See Also

submit( )

Syntax

type RsvpForm = {
  inputValues: Array<InputValue>
}
MEMBERS
?
The properties of an object.
inputValues
Array<InputValue>
Values that were entered in the RSVP form.

Examples

Submit an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.submit(formValues)
  .then( (response) => {
    let totalGuests = response.totalGuests; // 2
    let firstGuestName = response.guests[0].fullName; // Jane Doe
  } )
  .catch( (error) => {
    let message = error.message; // "Guest limit exceeded: only 1 person can RSVP"
    let errorType = error.errorType; // "GUEST_LIMIT_REACHED"
  });

/*
 * Success response:
 * {
 *   "anonymized": false,
 *   "contactId": "f1b9e9b3-5acb-4f15-ada8-e31a34a376ec",
 *   "createdDate": "2019-09-02T12:29:34.944Z",
 *   "email": "john.doe@somedomain.com",
 *   "eventId": "caad2acf-5c64-4eab-97f8-6710feac9151",
 *   "firstName": "John",
 *   "lastName": "Doe",
 *   "guests": [
 *     {
 *       "index": 0, 
 *       "fullName": "John Doe", 
 *       "id": 1
 *     }
 *   ],
 *   "id": "c71fc4d1-661e-473c-8b8c-74d97cf91b22",
 *   "memberId": "",
 *   "updatedDate": "2019-09-02T12:29:34.944Z",
 *   "rsvpForm": {
 *     "inputValues": [
 *       {
 *         "inputName": "firstName",
 *         "value": "John",
 *         "values": [],
 *       },
 * 
 *       ...
 * 
 *       {
 *         inputName: "custom",
 *         value: "",
 *         values: ["Gluten free", "Vegetarian"],
 *       }
 *     ]
 *   },
 *   "status": "YES"
 *   "totalGuests": 1
 * }
 */

RsvpInputItem

An object containing information about an input field in an RSVP form.

See Also

getRsvpData( )

Syntax

type RsvpInputItem = {
  _id: string
  array: boolean
  label: string
  additionalLabels: Array<AdditionalLabel>
  options: Array<string>
  maxLength: number
  name: string
  required: boolean
  controlType: string
}
MEMBERS
?
The properties of an object.
_id
string
Unique input identifier.
array
boolean
Whether the input field's value is an array.
label
string
Input field display label.
additionalLabels
Addition field display labels for complex fields.
options
Array<string>
List of value options where applicable.
maxLength
number
Maximum length of the input field's value. A value of 0 indicates no maximum length.
name
string
Input field name.
required
boolean
Whether the input field is required.
controlType
string

The type of the input field. One of:

  • "NAME"
  • "INPUT"
  • "RADIO"
  • "CHECKBOX"
  • "DROPDOWN"
  • "GUEST_CONTROL"
  • "ADDRESS_FULL"
  • "TEXTAREA"
  • "DATE"

Examples

Get RSVP form data

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId)

form.getRsvpData()
  .then( (rsvpData) => {
    let fields = rsvpData.rsvpFormInputs;
    let firstFieldName = fields[0].name;
    let statusOptions = rsvpData.rsvpStatusOptions;
    let registrationStatus = rsvpData.registrationStatus;
  } );

/*  rsvpData:
 *
 *  {
 *    "rsvpStatusOptions": "YES_AND_NO,
 *    "registrationStatus": "OPEN_RSVP",
 *    "rsvpFormInputs": [
 *      {
 *        "_id": "37a5789b-27d1-43a3-703b-a93dedad5b01",
 *        "additionalLabels": [],
 *        "array": false,
 *        "controlType": "NAME",
 *        "label": "First Name",
 *        "required": true,
 *        "maxLength": 50,
 *        "name": "firstName",
 *        "options": []
 *      },
 *  
 *      ...
 *  
 *      {
 *        "_id": "27d5789b-137a-43ed-a33d-a9703bad5b01",
 *        "additionalLabels": [
 *          {
 *            "name": "one",
 *            "label": "I'm bringing a plus one"
 *          },
 *          {
 *            "name": "multiple",
 *            "label": "Additional Guests"
 *          }
 *        ],
 *        "array": false,
 *        "controlType": "GUEST_CONTROL",
 *        "label": "I'm bringing a plus one",
 *        "required": true,
 *        "maxLength": 0,
 *        "name": "additionalGuests",
 *        "options": [
 *          "0",
 *          "1"
 *        ]
 *      }
 *    ]
 *  }
 */

RsvpResponse

An object representing a response to submitting an RSVP.

See Also

submit( )

Syntax

type RsvpResponse = {
  id: string
  anonymized: boolean
  contactId: string
  createdDate: Date
  email: string
  eventId: string
  firstName: string
  lastName: string
  guests: Array<Guest>
  rsvpForm: RsvpForm
  memberId: string
  updatedDate: Date
  status: string
  totalGuests: number
}
MEMBERS
?
The properties of an object.
id
string
RSVP ID
anonymized
boolean
Indicates whether the guest's personal information has been deleted or not.
contactId
string
Contact ID of the guest who submitted the RSVP form.
createdDate
Date
Date when the RSVP was submitted.
email
string
Email address to the guest who submitted the RSVP form.
eventId
string
ID of the event the RSVP is for.
firstName
string
First name of the guest who submitted the RSVP form.
lastName
string
Last name of the guest who submitted the RSVP form.
guests
Array<Guest>
All of the guests included in the RSVP.
rsvpForm
A representation of the RSVP form that was submitted.
memberId
string
Member ID of the guest who submitted the RSVP form if the guest is a site member.
updatedDate
Date
Date when RSVP was last modified.
status
string
RSVP status.
totalGuests
number
Total number of guests included in the RSVP.

Examples

Submit an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.submit(formValues)
  .then( (response) => {
    let totalGuests = response.totalGuests; // 2
    let firstGuestName = response.guests[0].fullName; // Jane Doe
  } )
  .catch( (error) => {
    let message = error.message; // "Guest limit exceeded: only 1 person can RSVP"
    let errorType = error.errorType; // "GUEST_LIMIT_REACHED"
  });

/*
 * Success response:
 * {
 *   "anonymized": false,
 *   "contactId": "f1b9e9b3-5acb-4f15-ada8-e31a34a376ec",
 *   "createdDate": "2019-09-02T12:29:34.944Z",
 *   "email": "john.doe@somedomain.com",
 *   "eventId": "caad2acf-5c64-4eab-97f8-6710feac9151",
 *   "firstName": "John",
 *   "lastName": "Doe",
 *   "guests": [
 *     {
 *       "index": 0, 
 *       "fullName": "John Doe", 
 *       "id": 1
 *     }
 *   ],
 *   "id": "c71fc4d1-661e-473c-8b8c-74d97cf91b22",
 *   "memberId": "",
 *   "updatedDate": "2019-09-02T12:29:34.944Z",
 *   "rsvpForm": {
 *     "inputValues": [
 *       {
 *         "inputName": "firstName",
 *         "value": "John",
 *         "values": [],
 *       },
 * 
 *       ...
 * 
 *       {
 *         inputName: "custom",
 *         value: "",
 *         values: ["Gluten free", "Vegetarian"],
 *       }
 *     ]
 *   },
 *   "status": "YES"
 *   "totalGuests": 1
 * }
 */

Create and submit an RSVP form

import wixEvents from 'wix-events';
import wixData from 'wix-data';

let form;

// Run a query that will return only one event. Add
// additional filtering to the query if necessary.
wixData.query("Events/Events")
  .eq("title", "My Event")
  .find()
  .then( (results) => {
    if(results.items.length > 0) {
      form = wixEvents.createEventRsvpForm(results.items[0]._id);
    }
    else {
      console.log("Could not find event");
    }
  });

$w.onReady(function () {
  $w("#submit").onClick( () => {
    const formValues = getFormValues();

    form.submit(formValues)
      .then( (result) => {
        console.log("RSVP form submitted.")
      } )
      .catch( (error) => {
        console.log(`Error message: ${error.message}`);
        if(error.fields) {
          console.log(`Incorrect fields: ${error.fields}`);  
        }
      } );	
  } );
});

function getFormValues() {
  return [
    {"name": "rsvpStatus", "value": "YES"},
    {"name": "firstName", "value": $w("#firstName").value},
    {"name": "lastName", "value": $w("#lastName").value},
    {"name": "email", "value": $w("#email").value},
    {"name": "custom", "value": $w("#foodAllergies").value},

    // When a form contains an address, the way you format the
    // address information for submission depends on what type
    // of input elements you use to gather that information.

    // Wix address input element.
    {"name": "address", "value": $w("#address").value},

    // Single element which is not an address
    // input element, such as a text input.
    {"name": "address", "value": [$w("#address").value]},

    // Multiple elements for the
    // various parts of an address.
    {
      "name": "address", 
      "value": [
        $w("#street").value,
        $w("#city").value,
        $w("#state").value,
        $w("#country").value,
        $w("#postalCode").value
      ]
    },

    // When a form contains an input for adding more guests to an
    // RSVP, format the guest names for submission in an array
    // where each element is the full name of a guest.
    {"name": "additionalGuests", "value": $w('#additionalGuests').value},
    {
      "name": "guestNames",
      "value": [
        `${$w("#guest1FirstName").value} ${$w("#guest1LastName").value}`,
        `${$w("#guest2FirstName").value} ${$w("#guest2LastName").value}`,
      ]
    }
  ];
}

SubmissionError

An object representing an error that occurred during an RSVP form submission.

See Also

submit( )

Syntax

type SubmissionError = {
  message: string
  errorType: string
}
MEMBERS
?
The properties of an object.
message
string
Error message.
errorType
string

Error type. One of:

  • "RSVP_CLOSED": Event registration is closed.
  • "GUEST_LIMIT_REACHED": The maximum number of guests has already been reached.
  • "MEMBER_ALREADY_REGISTERED": The current registrant is already registered as a guest.
  • "WAITING_LIST_UNAVAILABLE": The maximum number of guests has already been reached and there is no waitlist.
  • "UNKNOWN_ERROR": Unknown error.

Examples

Submit an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.submit(formValues)
  .then( (response) => {
    let totalGuests = response.totalGuests; // 2
    let firstGuestName = response.guests[0].fullName; // Jane Doe
  } )
  .catch( (error) => {
    let message = error.message; // "Guest limit exceeded: only 1 person can RSVP"
    let errorType = error.errorType; // "GUEST_LIMIT_REACHED"
  });

/*
 * Success response:
 * {
 *   "anonymized": false,
 *   "contactId": "f1b9e9b3-5acb-4f15-ada8-e31a34a376ec",
 *   "createdDate": "2019-09-02T12:29:34.944Z",
 *   "email": "john.doe@somedomain.com",
 *   "eventId": "caad2acf-5c64-4eab-97f8-6710feac9151",
 *   "firstName": "John",
 *   "lastName": "Doe",
 *   "guests": [
 *     {
 *       "index": 0, 
 *       "fullName": "John Doe", 
 *       "id": 1
 *     }
 *   ],
 *   "id": "c71fc4d1-661e-473c-8b8c-74d97cf91b22",
 *   "memberId": "",
 *   "updatedDate": "2019-09-02T12:29:34.944Z",
 *   "rsvpForm": {
 *     "inputValues": [
 *       {
 *         "inputName": "firstName",
 *         "value": "John",
 *         "values": [],
 *       },
 * 
 *       ...
 * 
 *       {
 *         inputName: "custom",
 *         value: "",
 *         values: ["Gluten free", "Vegetarian"],
 *       }
 *     ]
 *   },
 *   "status": "YES"
 *   "totalGuests": 1
 * }
 */

ValidationResult

An object representing the result of a form validation.

See Also

validate( )

Syntax

type ValidationResult = {
  valid: boolean
}
MEMBERS
?
The properties of an object.
valid
boolean
Indicates that the RSVP form fields are valid.

Examples

Validate an RSVP form

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.validate(formValues)
  .then( (response) => {
    // handle case where form is valid
  } )
  .catch( (error) => {
    // handle case where form is not valid
    let message = error.message; // "Following fields have invalid IDs: nonExistent1, nonExistent2"
    let fields = error.fields; // ["nonExistent1", "nonExistent2"]
  });

ValueValidationError

An object representing an error that occurred during validation of an RSVP form's values.

See Also

validateInput( ), submit( )

Syntax

type ValueValidationError = {
  message: string
  inputId: string
  errorType: string
}
MEMBERS
?
The properties of an object.
message
string
Error message.
inputId
string
ID of the input field that failed validation.
errorType
string

Error type. One of:

  • "EMPTY_INPUT": A required field is missing its value.
  • "INVALID_INPUT_VALUE": The value is not valid for the field type.
  • "INPUT_TOO_LONG": The value is too long.
  • "INVALID_OPTION": The value does not match one of the defined options for the field.
  • "INVALID_STATUS": The status value is not valid.
  • "INVALID_NUMBER_OF_GUESTS": The number of guests does not match the number defined for the form.

Examples

Validate an RSVP form's values

import wixEvents from 'wix-events';

// ...

const eventId = // Get the event ID
const form = wixEvents.createEventRsvpForm(eventId);

// ...

let formValues = // get form values

form.validateInput("firstName", formValues)
  .then( (response) => {
    // handle case where firstName is valid
  } )
  .catch( (error) => {
    // handle case where firstName is not valid
    let message = error.message; // "First Name is required"
    let type = error.errorType; // "EMPTY_INPUT"
    let inputId = error.inputId; // firstName
  });