neatComponents: website development system
Search 
spacer
spacer
Previous pageThe Guide Next page
Forms, Queries & Views - a simple example 
spacerspacer

The relationship between Forms, Queries and Views is at the heart of how neatComponents manages data.  This simple relationship is used time and again by neatComponents to build websites that can handle very large amounts of data with ease - and without requiring the website designer to know anything about any coding or relational databases

There is a technical description  of these components elsewhere on the site, but in this section we are going to illustrate how you use a Form to get information into the site, which is then Queried to produce a View which is Embedded on an Editable page so that it can be seen by visitors to the site.

A Simple Example

In this example we are going to create a Form containing two fields: Name and Email. The purpose of our example Form is to collect Names and Email addresses from visitors to the site. Will will then use a Query to sort them alphabetically, and we will display the resultant list on a Page.

Stage 1 - The Form

Go to the Layout Manager, and add a Form to our site, calling it 'Contact Form'.

  1. From any page, click the Toolbox icon, and click 'Layout Manager'. The Layout Manager will be shown.
  2. In the Component Store, select 'Form', and click 'Add to Component Bank'
  3. In the Component Bank, select 'Form'.
  4. In the Name box below, edit 'Form' to read 'Contact Form'
  5. Click 'Add to Web Site', and using the mouse click on the Web Site tree where you want the Form to appear.


Note the location is not critical in this example and does not affect the functionality of the component, simply its location in the website navigation links (however see also Inheritance for important exceptions where the location can be used to control the behavior)

Go to the Contact Form, and add a Text field, calling it 'Name', and an Email field, calling that 'Email address'.

Add some example contacts to the Form (these aren't really necessary at this stage, but will make it easier to see what we are doing in the stages that follow).


Stage 2 - The Query

Go to the Layout Manager, and add a Query to our site, calling it 'Contact Query'.

Go to the Contact Query, and add the two fields from the Contact Form.

Select the Name field, and set it to sort alphabetically.


Stage 3 - The Page

Go to the Layout Manager, and add a Page to our site, calling it 'Contact List Page'.

Go to the Contact List Page, and edit the page.

In the editor, embed the Contact Query.


 

 

spacer
Managing data