14.3 Forms

In web development, the following workflow will probably look quite familiar:

  • Open a web page showing a form
  • Users fill out and submit the form
  • If a user submits some invalid information or has neglected to fill out a required field, the form will be returned to the user (along with the filled in data) with some descriptive information about the problem.
  • Users re-fill the invalid fields and continue attempting to submit the form until it's accepted

At the receiving end, the script must:

  • Check the user submitted form data.
  • Verify whether the data is the correct type and of the appropriate standard. For example, if a username is submitted, it must verify that it contains only valid characters. Other examples would be checking for minimum and maximum lengths, username uniqueness, and so on.
  • Filtering data and cleaning up unsafe characters to guarantee that our application only processes data which is safe.
  • If necessary, pre-format the data (or data gaps need to be cleared through the HTML coding and so on.)
  • Prepare the data for insertion into the database

Although the procedure is not very complex, it usually requires a lot of boilerplate. In addition, web applications often use a variety of different control structures to display error messages on returned pages. Implementing form validation is a simple but boring task.

Forms and validation

For developers, the general development process can be quite complex, but it's mostly repetitive work. Suppose a scenario arises where you suddenly need to add a form to your project, causing you to rewrite all of the local code tied in with the form. We know that structs are a very commonly used data structure in Go, and Beego uses them to its advantage for processing form information.

First, we define a struct with fields corresponding to the fields in our form element. We can use struct tags which map to the form element, as shown below:

When developing Web applications, first define a struct that matches a field to a corresponding form element, defined by using a struct tag corresponding to the element information and authentication information, as shown below:

For developers, the general development process is very complex, and mostly consists of repeating the same work process. Assuming a scenario for a project whereby a need arises to add data to a form, then the local code of the entire process needs to be modified. We know in Go a struct is a common data structure, so beego uses a form struct to process form information.

First define a struct with fields corresponding to our form element, using struct tags to define the corresponding form element and authentication information, like so:

type User struct{
    Username     string     `form:text,valid:required`
    Nickname     string     `form:text,valid:required`
    Age        int     `form:text,valid:required|numeric`
    Email         string     `form:text,valid:required|valid_email`
    Introduce     string     `form:textarea`
}

After defining our struct, we can add this action in our controller:

func (this *AddController) Get() {
    this.Data["form"] = beego.Form(&User{})
    this.Layout = "admin/layout.html"
    this.TplNames = "admin/add.tpl"
}        

The form is displayed in our template like so:

<h1>New Blog Post</h1>
<form action="" method="post">
{{.form.render()}}
</form>

Above, we've defined the entire first step of displaying a form mapped to a struct. The next step is for users to fill in their information and submit the form, after which the server will receive the data and verify it. Finally, the record will be inserted into the database.

func (this *AddController) Post() {
    var user User
    form := this.GetInput(&user)
    if !form.Validates() {
        return 
    }
    models.UserInsert(&user)
    this.Ctx.Redirect(302, "/admin/index")
}    

Form type

The following table lists the corresponding form element information:

<table cellpadding="0" cellspacing="1" border="0" style="width:100%" class="tableborder">
  <tbody>
    <tr>
      <th>Name</th>
      <th>parameter</th>
      <th>Description</th>
    </tr>
    <tr>
      <td class="td"><strong>text</strong>
      </td>
      <td class="td">No</td>
      <td class="td">textbox input box</td>
    </tr>

    <tr>
      <td class="td"><strong>button</strong>
      </td>
      <td class="td">No</td>
      <td class="td">button</td>
    </tr>

    <tr>
      <td class="td"><strong>checkbox</strong>
      </td>
      <td class="td">No</td>
      <td class="td">multi-select box</td>
    </tr>

    <tr>
      <td class="td"><strong>dropdown</strong>
      </td>
      <td class="td">No</td>
      <td class="td">drop-down selection box</td>
    </tr>

    <tr>
      <td class="td"><strong>file</strong>
      </td>
      <td class="td">No</td>
      <td class="td">file upload</td>
    </tr>

    <tr>
      <td class="td"><strong>hidden</strong>
      </td>
      <td class="td">No</td>
      <td class="td">hidden elements</td>
    </tr>

    <tr>
      <td class="td"><strong>password</strong>
      </td>
      <td class="td">No</td>
      <td class="td">password input box</td>
    </tr>

    <tr>
      <td class="td"><strong>radio</strong>
      </td>
      <td class="td">No</td>
      <td class="td">single box</td>
    </tr>

    <tr>
      <td class="td"><strong>textarea</strong>
      </td>
      <td class="td">No</td>
      <td class="td">text input box</td>
    </tr>
  </tbody>
</table>

Form validation

The following table lists some form validation rules native to Beego that can be used:

<table cellpadding="0" cellspacing="1" border="0" style="width:100%" class="tableborder">
  <tbody>
    <tr>
      <th>rules</th>
      <th>parameter</th>
      <th>Description</th>
      <th>Example</th>
    </tr>

    <tr>
      <td class="td"><strong>required</strong>
      </td>
      <td class="td">No</td>
      <td class="td">If the element is empty, it returns FALSE</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>matches</strong>
      </td>
      <td class="td">Yes</td>
      <td class="td">if the form element's value with the corresponding form field parameter values are not equal, then return
        FALSE</td>
      <td class="td">matches [form_item]</td>
    </tr>


    <tr>

      <td class="td"><strong>is_unique</strong>
      </td>

      <td class="td">Yes</td>

      <td class="td">if the form element's value with the specified field in a table has duplicate data, it returns False( Translator's
        Note: For example is_unique [User.Email], then the validation class will look for the User table in the
        Email field there is no form elements with the same value, such as deposit repeat, it returns false, so
        developers do not have to write another Callback verification code.)</td>

      <td class="td">is_unique [table.field]</td>
      </tr>

    <tr>
      <td class="td"><strong>min_length</strong>
      </td>
      <td class="td">Yes</td>
      <td class="td">form element values if the character length is less than the number of defined parameters, it returns FALSE</td>
      <td class="td">min_length [6]</td>
    </tr>

    <tr>
      <td class="td"><strong>max_length</strong>
      </td>
      <td class="td">Yes</td>
      <td class="td">if the form element's value is greater than the length of the character defined numeric argument, it returns
        FALSE</td>
      <td class="td">max_length [12]</td>
    </tr>

    <tr>
      <td class="td"><strong>exact_length</strong>
      </td>
      <td class="td">Yes</td>
      <td class="td">if the form element values and parameters defined character length number does not match, it returns FALSE</td>
      <td class="td">exact_length [8]</td>
    </tr>


    <tr>

      <td class="td"><strong>greater_than</strong>
      </td>

      <td class="td">Yes</td>

      <td class="td">If the form element values non- numeric types, or less than the value defined parameters, it returns FALSE</td>

      <td class="td">greater_than [8]</td>
      </tr>


    <tr>

      <td class="td"><strong>less_than</strong>
      </td>

      <td class="td">Yes</td>

      <td class="td">If the form element values non- numeric types, or greater than the value defined parameters, it returns FALSE</td>

      <td class="td">less_than [8]</td>
      </tr>

    <tr>
      <td class="td"><strong>alpha</strong>
      </td>
      <td class="td">No</td>
      <td class="td">If the form element value contains characters other than letters besides, it returns FALSE</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>alpha_numeric</strong>
      </td>
      <td class="td">No</td>
      <td class="td">If the form element values contained in addition to letters and other characters other than numbers, it returns
        FALSE</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>alpha_dash</strong>
      </td>
      <td class="td">No</td>
      <td class="td">If the form element value contains in addition to the letter/ number/ underline/ characters other than dash,
        returns FALSE</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>numeric</strong>
      </td>
      <td class="td">No</td>
      <td class="td">If the form element value contains characters other than numbers in addition, it returns FALSE</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>integer</strong>
      </td>
      <td class="td">No</td>
      <td class="td">except if the form element contains characters other than an integer, it returns FALSE</td>
      <td class="td"></td>
    </tr>


    <tr>

      <td class="td"><strong>decimal</strong>
      </td>

      <td class="td">Yes</td>

      <td class="td">If the form element type( non- decimal ) is not complete, it returns FALSE</td>

      <td class="td"></td>
      </tr>

    <tr>
      <td class="td"><strong>is_natural</strong>
      </td>
      <td class="td">No</td>
      <td class="td">value if the form element contains a number of other unnatural values ( other values excluding zero ), it
        returns FALSE. Natural numbers like this: 0,1,2,3.... and so on.</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>is_natural_no_zero</strong>
      </td>
      <td class="td">No</td>
      <td class="td">value if the form element contains a number of other unnatural values ( other values including zero ), it
        returns FALSE. Nonzero natural numbers: 1,2,3..... and so on.</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>valid_email</strong>
      </td>
      <td class="td">No</td>
      <td class="td">If the form element value contains invalid email address, it returns FALSE</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>valid_emails</strong>
      </td>
      <td class="td">No</td>
      <td class="td">form element values if any one value contains invalid email address( addresses separated by commas in English
        ), it returns FALSE.</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>valid_ip</strong>
      </td>
      <td class="td">No</td>
      <td class="td">if the form element's value is not a valid IP address, it returns FALSE.</td>
      <td class="td"></td>
    </tr>

    <tr>
      <td class="td"><strong>valid_base64</strong>
      </td>
      <td class="td">No</td>
      <td class="td">if the form element's value contains the base64-encoded characters in addition to other than the characters,
        returns FALSE.</td>
      <td class="td"></td>
    </tr>

  </tbody>
</table>

results matching ""

    No results matching ""