Edit Page Code Sample

Here is some example code to build an edit page for the Accounts app. This is just an example and you have the flexibility to lay out the page to suit your own design.

Below is a screenshot of the layout that this code will build. 

HTML:

Below is the HTML / Branch code that would go in the Template field for the Tag List content template.

<h1>Edit My Account</h1>
<div class="content">
  {if #editForm.errorCount > 0}
    <div class="error">
      You've got {#editForm.errorCount} error(s).
      <ul>
        {loop items="#editForm.errors" value="error"}
          {loop items="#error" value="value"}
            <li>{#value}</li>
          {/loop}
        {/loop}
      </ul>
    </div>
  {/if}
  <form method="{#editForm.method}" action="{#editForm.action}">
    <h4>Account Information</h4>
    <table cellpadding="0" cellspacing="0" class="tblRegistration">
      <tr>
        <td colspan="2">Username</td>
      </tr>
      <tr>
        <td>
          <input type="text" name="{#editForm.fields.username.name}" value="{#editForm.fields.username.value}" title="Username" class="noExample" />
        </td>
      <th>&lt;- pick something unique.</th>
    </tr>
    <tr>
      <td colspan="2">Password</td>
    </tr>
    <tr>
      <td>
        <input type="password" name="{#editForm.fields.password.name}" value="{#editForm.fields.password.value}" title="Password" class="noExample" />
      </td>
      <th>&lt;- must be at least 4 characters long.</th>
    </tr>
    <tr>
      <td colspan="2">Confirm Password</td>
    </tr>
    <tr>
      <td>
        <input type="password" name="{#editForm.fields.confirmPassword.name}" value="{#editForm.fields.confirmPassword.value}" title="Confirm Password" class="noExample" />
      </td>
      <th>&lt;- repeat above. exactly.</th>
    </tr>
  </table>
  <h4>Contact Information</h4>
  <table cellpadding="0" cellspacing="0" class="tblRegistration">
    <tr>
      <td colspan="2">First Name</td>
    </tr>
    <tr>
      <td>
        <input type="text" name="{#editForm.fields.firstName.name}" value="{#editForm.fields.firstName.value}" title="First Name" class="noExample" />
      </td>
      <th>&lt;- your given name.</th>
    </tr>
    <tr>
      <td colspan="2">Last Name</td>
    </tr>
    <tr>
      <td>
        <input type="text" name="{#editForm.fields.lastName.name}" value="{#editForm.fields.lastName.value}" title="Last Name" class="noExample" />
      </td>
      <th>&lt;- your surname.</th>
    </tr>
    <tr>
      <td colspan="2">Email</td>
    </tr>
    <tr>
      <td>
        <input type="text" name="{#editForm.fields.email.name}" value="{#editForm.fields.email.value}" title="Email" class="noExample" />
      </td>
      <th>&lt;- where can we send you spam?</th>
    </tr>
  </table>

  <input type="submit" name="submit" value="" id="submit-register" />
</form>

</div>