Example: Contact Form

This example builds a contact form with validation, required fields, and email submission.

What We’re Building

A contact form that:

  • Collects name, email, phone, and message
  • Validates email format
  • Requires name, email, and message
  • Submits data via email
  • Shows a thank-you message after submission

Step 1: Create the Excel Spreadsheet

Sheet1 (Form)

A B
1 Contact Us
2
3 Name
4 Email
5 Phone
6 Subject General Inquiry
7 Message
8
9 [Submit]

Sheet2 (Thank You)

A
1 Thank You!
2
3 We’ve received your message and will respond within 24 hours.
4
5 [Submit Another Message]

Formatting

  • Row 1: Bold, larger font
  • B3:B7: Light background color to indicate input fields
  • B9, A5 (Sheet2): Button styling (centered, colored background)

Step 2: Configure NExS.app

A B C D E
1 app Contact Form
2 mode open
3 submitList contact@yourcompany.com
4 noViewNav true
5 view Sheet1!A1:B9
6 name Form
7 backgroundColor #ffffff
8 input B3 required # Name
9 input B4 required, email # Email
10 input B5 phone # Phone (optional)
11 input B6 # Subject
12 input B7 required # Message
13 button B9
14 view Sheet2!A1:A5
15 name Thank You
16 button A5

Step 3: Configure Button Actions

Submit Button (Sheet1, B9)

Cell content: Submit {disabled: %REQUIRED, sendData: 'B3:B7', setInputs: ['B3:B7', ''], setView: 'Thank You'}

This button:

  • Is disabled until all required fields are filled (%REQUIRED)
  • Sends form data to the submitList email
  • Clears all form fields
  • Navigates to the Thank You view

Submit Another Button (Sheet2, A5)

Cell content: Submit Another Message {setView: 'Form'}

Returns to the form view for a new submission.

Step 4: Upload and Test

  1. Save as .xlsx
  2. Upload to NExS platform
  3. Test the form:
    • Leave required fields empty (Submit should be disabled)
    • Enter invalid email (should show error)
    • Fill all required fields (Submit becomes active)
    • Click Submit (form clears, shows thank-you)

Step 5: Embed on Your Website

Basic Iframe

<iframe
  src="https://platform.nexs.com/app/YOUR-APP-ID"
  width="400"
  height="400"
  style="border:0;">
</iframe>

Adding a Subject Dropdown in Excel

To create a dropdown in the NExS app itself:

  1. In Excel, use Data Validation on cell B6:

    • Allow: List
    • Source: General Inquiry, Support Request, Sales Question, Partnership
  2. NExS will render this as a dropdown in the app

Complete NExS.app Worksheet

A B C D E
1 app Contact Form
2 mode open
3 submitList contact@yourcompany.com
4 noViewNav true
5 view Sheet1!A1:B9
6 name Form
7 backgroundColor #ffffff
8 input B3 required
9 input B4 required, email
10 input B5 phone
11 input B6
12 input B7 required
13 button B9
14 view Sheet2!A1:A5
15 name Thank You
16 button A5

What You Learned

  • Using required field validation
  • Email and phone format validation
  • The sendData action to email form data
  • Chaining multiple button actions
  • The %REQUIRED macro for conditional button state
  • Multi-view forms with view navigation

Next Steps