Creating / Storing Form Data

Whatever forms you create with Gridbox, you can store the entire form data with Netlify without writing any script or code.

Gridbox is tightly integrated with Netlify Forms. When you use pre-built Contact Forms or create HTML forms from scratch, you form can instantly accept submissions—no backend code or infrastructure required. As soon as your website is deployed to Netlify, you start accepting submissions which will appear in your Netlify dashboard.

This setting only works with Netlify platform. Whenever you publish your Project to Netlify, your website will be ready to receive user submissions. You can even Download and host with Netlify platform manually.

How to setup Netlify Forms?

By default, we've enabled "Save to Netlify" setting for all pre-built contact forms, so you don't have to change anything. So, you can start with pre-built contact forms. All you need is to drag and drop the contact form, add any extra fields if you want. Once you're ready click on the Publish button to deploy to Netlify. That's it.

This setting is enabled by default for all pre-built contact forms. You don't have to configure anything.

Using pre-built contact forms

Selecting the form element to change Netlify form settings

Sometimes, it is difficult to select the form element in the canvas straightway as the form element may be deeply nested inside some DIV element or Section element, but with Inspect you can do that easily.

  1. Click on any input field inside the form.

  2. From the left sidebar click on the Inspect panel.

  3. It will highlight the element you've selected in the Inspect panel. The selected element will be the child of form element (nested inside form element).

  4. Look for the form element. Click on the that.

  5. Click on the property tab to change the Netlify settings.

Selecting Form Element to change Netlify Form settings

Creating Forms from Scratch

If you want to create your own form, do the following.

  1. Drag and Drop Empty Form from the components any where in the canvas.

  2. Make sure that you drag and drop all the input elements inside the form block like lable, input field, email, textarea, dropdown, etc...

  3. Click on the form element by using the previous step

  4. From the left sidebar under Properties Panel -> click on the Save to Netlify checkbox as mentioned in the image below.

Netlify Form Settings

Viewing Form Data using Netlify

Once you've designed the page, you need to Deploy the project to to Netlify using Publish button from the top right.

  1. Once you publish, click on the published url

  2. Fill the form with dummy data to test the form submission

  3. Go back to Editor, from the publish click on the domain settings to open Netlify - it will open the Netlify site settings automatically.

  4. Click on the form tab, where you can find all form submission across your site.

Testing Netlify Form submission

Netlify form submission

Viewing Form Data

Viewing Form Data