We are going to write a very simple form. It has a single input field and a submit button. When the form is submitted, the text that was typed in is displayed.

First, we define a title for our html form page.

<tpl:myformsInfo name="title">{{tpl:BlogName encode_html="1"}} - Hello !</tpl:myformsInfo>

The <tpl:myformsInfo> tag allows to create any kind of data associated to our form. The default form display uses the data named "title" as the title of the html form page.

Then, we define the form content :

<tpl:myformsOnInit>
  <p><strong>This is the a very simple form</strong></p>
  <p>What's your name ?</p>
  <p><tpl:myformsTextField name="yourname"></tpl:myformsTextField></p>
  <p><tpl:myformsSubmit name="sayhello">Click me</tpl:myformsSubmit></p>
</tpl:myformsOnInit>

The <tpl:myformsOnInit> tag handles the display of the form. It contains any kind of html or dotclear template tags. For our text input and submit button, we use myforms dedicated tags : <tpl:myformsTextField> and <tpl:myformsSubmit>.

Eventually, we define the form behavior upon submission.

<tpl:myformsOnSubmit name="sayhello">
  <tpl:myformsOnSuccess>
    <p><strong>Hello {{tpl:myformsFieldValue name="yourname"}} !</strong></p>
  </tpl:myformsOnSuccess>
</tpl:myformsOnSubmit>

The <tpl:myformsOnSubmit> tag handles the form processing when a given submit button is clicked. In our simple form, there's no real processing such as updating a database or sending an email, so the processing never fails : the <tpl:myformsOnSuccess> tag allows us to define the html output. We use the {{tpl:myformsFieldValue}} tag to retrieve the text entered in our text input.

The complete code for this exemple is available in the plugin 'demo' folder in the hello.myforms.html file. Just copy this file into a template folder to use it.