validateInput( )

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

Description

Deprecation note: The validateInput() function of the RsvpForm object is being deprecated. Use the validateInput() function of the Form object instead.

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>

validateInput Parameters

NAME

TYPE

DESCRIPTION

inputName

string

Name of the input field to validate.

formValues

Array<FormValue>

Field names and values for an RSVP form.

Returns

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

Return Type:

Promise<ValidationResult>

NAME

TYPE

DESCRIPTION

valid

boolean

Indicates that the RSVP form fields are valid.

Was this helpful?

Validate an RSVP form value

Copy Code

1import wixEventsFrontend from 'wix-events-frontend';
2
3// ...
4
5const eventId = // Get the event ID
6const form = wixEventsFrontend.createEventRsvpForm(eventId);
7
8// ...
9
10let formValues = // get form values
11
12form.validateInput("firstName", formValues)
13  .then((response) => {
14    // handle case where firstName is valid
15  })
16  .catch((error) => {
17    // handle case where firstName is not valid
18    let message = error.message; // "First Name is required"
19    let type = error.errorType; // "EMPTY_INPUT"
20    let inputId = error.inputId; // firstName
21  });

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

Copy Code

1import wixEventsFrontend from 'wix-events-frontend';
2
3// ...
4
5const eventId = // Get the event ID
6const form = wixEventsFrontend.createEventRsvpForm(eventId);
7
8// ...
9
10$w("#firstName").onCustomValidation((value, reject) => {
11  form.validateInput("firstName", getFormValues())
12    .catch((error) => {
13      let message = error.message; // "First Name is required"
14      let type = error.errorType; // "EMPTY_INPUT"
15      let inputId = error.inputId; // firstName
16    });
17});

Create and submit an RSVP form

Copy Code

1import wixEventsFrontend from 'wix-events-frontend';
2import wixData from 'wix-data';
3
4$w.onReady(function () {
5  let form;
6
7  // Run a query that returns only one event. Add
8  // additional filtering to the query if necessary.
9  wixData.query("Events/Events")
10    .eq("title", "My Event")
11    .find()
12    .then((results) => {
13      if (results.items.length > 0) {
14        form = wixEventsFrontend.createEventRsvpForm(results.items[0]._id);
15      } else {
16        console.log("Could not find event");
17      }
18    });
19  
20  $w("#submit").onClick(() => {
21    const formValues = getFormValues();
22
23    form.submit(formValues)
24      .then((result) => {
25        console.log("RSVP form submitted.")
26      })
27      .catch((error) => {
28        console.log(`Error message: ${error.message}`);
29        if (error.fields) {
30          console.log(`Incorrect fields: ${error.fields}`);	
31        }
32      });	
33  });
34});
35
36function getFormValues() {
37  return [
38    {"name": "rsvpStatus", "value": "YES"},
39    {"name": "firstName", "value": $w("#firstName").value},
40    {"name": "lastName", "value": $w("#lastName").value},
41    {"name": "email", "value": $w("#email").value},
42    {"name": "custom", "value": $w("#foodAllergies").value},
43
44    // When a form contains an address, the way you format the
45    // address information for submission depends on what type
46    // of input elements you use to gather that information.
47
48    // Wix address input element.
49    {"name": "address", "value": $w("#address").value},
50
51    // Single element which is not an address
52    // input element, such as a text input.
53    {"name": "address", "value": [$w("#address").value]},
54
55    // Multiple elements for the
56    // various parts of an address.
57    {
58      "name": "address", 
59      "value": [
60        $w("#street").value,
61        $w("#city").value,
62        $w("#state").value,
63        $w("#country").value,
64        $w("#postalCode").value
65      ]
66    },
67
68    // When a form contains an input for adding more guests to an
69    // RSVP, format the guest names for submission in an array
70    // where each element is the full name of a guest.
71    {"name": "additionalGuests", "value": $w('#additionalGuests').value},
72    {
73      "name": "guestNames",
74      "value": [
75        `${$w("#guest1FirstName").value} ${$w("#guest1LastName").value}`,
76        `${$w("#guest2FirstName").value} ${$w("#guest2LastName").value}`,
77      ]
78    }
79  ];
80}