<?xml version="1.0"?>
<!--
  Licensed to the Apache Software Foundation (ASF) under one or more
  contributor license agreements.  See the NOTICE file distributed with
  this work for additional information regarding copyright ownership.
  The ASF licenses this file to You under the Apache License, Version 2.0
  (the "License"); you may not use this file except in compliance with
  the License.  You may obtain a copy of the License at

      http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->
<document xmlns:ft="http://apache.org/cocoon/forms/1.0#template"
          xmlns:fi="http://apache.org/cocoon/forms/1.0#instance">
 <header>
  <title>JFlow example</title>
  <tab title="back" href="."/>
 </header>
 <body>
  <row>
   <column title="Forms example">
    <p>This form is used to illustrate the Woody binding framework. The binding
      is based on JXPath and hence works both with XML documents and beans.
      Some warnings and limitations of the current implementation:</p>
    <ul>
      <li>the email address is marked in the binding as "read-only", meaning it
        will only be bound from bean/xml to form, but not in the other
        direction. So you won't see it changed in the bean or the XML.</li>
      <li>The binding doesn't support all widget types yet.</li>
      <li>Note how, in the XML binding, the date is formatted according XML
        Schema date format in the XML, while it is displayed in another format
        to the user, and is stored in the form model as a Java Date
        object (useful for date-specific validations).</li>
    </ul>
    <p>If you're running the XML-binding demo, then after successful submit
      you'll see the updated XML.</p>
    <p>If you're running the bean-binding demo, then after successful submit
      you'll be shown a page that uses the JXTemplateGenerator to extract
      data from the bean (to show that the bean really has been updated).</p>
    <ft:form-template action="#{$continuation/id}.cont" method="POST">
      <table border="1">
        <tr>
          <td valign="top"><ft:widget-label id="email"/></td>
          <td valign="top"><ft:widget id="email"/></td>
        </tr>
        <tr>
          <td valign="top"><ft:widget-label id="phone"/></td>
          <td valign="top"><ft:widget id="phone" /></td>
        </tr>
        <tr>
          <td valign="top"><ft:widget-label id="ipaddress"/></td>
          <td valign="top"><ft:widget id="ipaddress"/></td>
        </tr>
        <tr>
          <td valign="top"><ft:widget-label id="birthday"/></td>
          <td valign="top"><ft:widget id="birthday"/></td>
        </tr>
        <tr>
          <td valign="top"><ft:widget-label id="number"/></td>
          <td valign="top"><ft:widget id="number"/></td>
        </tr>
        <tr>
          <td/>
          <td valign="top"><ft:widget id="choose"/> <ft:widget-label id="choose"/></td>
        </tr>
        <tr>
          <td valign="top"><ft:widget-label id="sex"/></td>
          <td valign="top"><ft:widget id="sex"/></td>
        </tr>
        <tr>
          <td valign="top"><ft:widget-label id="drinks"/></td>
          <td valign="top">
            <ft:widget id="drinks">
              <fi:styling list-type="listbox" listbox-size="4"/>
            </ft:widget>
          </td>
        </tr>
      </table>

      <ft:widget-label id="contacts"/><br/>
      <ft:repeater-size id="contacts"/>
      <table border="1">
        <tr>
          <th><ft:repeater-widget-label id="contacts" widget-id="firstname"/></th>
          <th><ft:repeater-widget-label id="contacts" widget-id="lastname"/></th>
          <th><ft:repeater-widget-label id="contacts" widget-id="phone"/></th>
          <th><ft:repeater-widget-label id="contacts" widget-id="email"/></th>
          <th><ft:repeater-widget-label id="contacts" widget-id="select"/></th>
        </tr>

        <!-- The contents of the repeater-widget element is a template that will
        be applied to each row in the repeater. -->
        <ft:repeater-widget id="contacts">
          <tr>
            <!-- Don't show the id
            <td>[<ft:widget id="id"/>]</td>
            -->
            <td><ft:widget id="firstname"/></td>
            <td><ft:widget id="lastname"/></td>
            <td><ft:widget id="phone"/></td>
            <td><ft:widget id="email"/></td>
            <td><ft:widget id="select"/></td>
          </tr>
        </ft:repeater-widget>

        <tr>
          <td colspan="4" align="right">
            <ft:widget id="addcontact"/>
            <ft:widget id="removecontacts"/>
          </td>
        </tr>
      </table>

      <input type="submit"/>
    </ft:form-template>
   </column>
  </row>
 </body>
</document>
