Forms
The same can be used with form data. You might have created forms previous to this in HTML but without some sort of server side language, there is a very limited number of things you can do with that data. Now when we submit a form we can use the variables submitted in our page. Fill out and submit this form:


First Name
First Name
Last Name
Last Name
Email address
name@example.com

Form Data - FORM Scope: 0
See the output above? The form data is in a Struct called Form. We can access the individual pieces typing form.variablename.

<form action="#cgi.script_name#?p=#p#" method="post">
    <div class="mb-3">
        <label for="firstName" class="form-label">First Name</label>
        <input type="text" class="form-control" id="firstName" name="first" placeholder="First Name">
    </div>
    <div class="mb-3">
        <label for="lastname" class="form-label">Last Name</label>
        <input type="text" class="form-control" id="lastname" name="last" placeholder="Last Name">
    </div>
    <div class="mb-3">
        <label for="exampleFormControlInput1" class="form-label">Email address</label>
        <input type="email" class="form-control" id="exampleFormControlInput1" name="email" placeholder="name@example.com">
    </div>
    <div>
        <button class="btn btn-primary">Submit</button>
    </div>
</form>
A form has several different tags in it. Here are the basics:

<form action="#cgi.SCRIPT_NAME#?#cgi.QUERY_STRING#" method="post"> - The <form> tag has two essential properties. The first is the action property. This is the file to which the browser will pass the form variables. Put another way, it's the page that will load when you submit the form. In this case, we are using BoxLang variables that will automatically put the name of the same page. If you use this, don't forget to wrap it in <bx:output>The "method" property says how the variables will be submitted. The two most common methods are <POST> and <GET>. For the moment, let's keep it simple. Using "get" will put the variables and their values in the address bar or in the URL scope. Using "post" will submit them another way which is behind the scenes, not in the URL.
<input type="text" name="firstname" placeholder="First Name" value="" /> - The input tag defines a place to put in a variable. You name the variable by using the "name" property in the <input> tag. The value is whatever is entered by the user or you predefine with the value property.
<input type="submit" value="save" /> - The <input type="submit"> creates a button that will submit the form. You can also use a <button> tag if you choose and by default this will submit the form.
For more HTML information about forms visit: http://www.w3schools.com/html/html_forms.asp
Exercise #3: In the MyForm.bxm page in the exercises folder, use HTML to create a form which submits to the same page. Make your form with 5 inputs that coincide with the properties in your database. On the page include <bx:dump var="#form#" label="The Form Data" /> so you can test the submission of the form.