This shows you the differences between two versions of the page.
| — |
tech:template-development [2010/02/15 10:25] (current) davidof created |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| + | ====== Magneato CMS Template Development ====== | ||
| + | Magneato uses XForms for page editing. XForms fix many of the problems associated with traditional HTML based web forms: | ||
| + | |||
| + | * They provide enhanced input elements | ||
| + | * Web 2.0 like functionality with processing handled on the client without a round trip to the server | ||
| + | * Input validation of forms elements on the client. | ||
| + | |||
| + | |||
| + | XForms 1.1 became an official W3Cstandard on the 20th October 2009. XForms are widely used in business, central and local government departments where forms data has to be processed in a standards compliant manner. | ||
| + | |||
| + | ===== Demo Templates ===== | ||
| + | |||
| + | Magneato is supplied with a number of demonstration templates. These are not intended to provide a tutorial to XForms. | ||
| + | |||
| + | ===== Book Demo ===== | ||
| + | |||
| + | The book demo is a list of book titles, authors and ratings. | ||
| + | |||
| + | {{:tech:book-demo1.jpg|Book Demo}} | ||
| + | **Book Demo View** | ||
| + | |||
| + | It shows a number of features of the Magneato XForms system: | ||
| + | |||
| + | * Help text attached to an input element (ISBN number) | ||
| + | * Range checking of the ISBN number | ||
| + | * A drop down list | ||
| + | * Ability to add new books in a Web 2.0 like way (all done on the client side) | ||
| + | |||
| + | {{:tech:book-demo2.jpg|}} | ||
| + | **Editing the Book Demo Page** | ||
| + | |||
| + | Clicking the "Add New Book" opens a new line where the user can add new book details. | ||
| + | |||
| + | {{:tech:book-demo3.jpg|}} | ||
| + | |||
| + | XForms templates are divided into a model and view part. This is a very common pattern in Web based systems as it separates data and how the data is presented. The Model/View/Controller pattern is also used by the Magneato server to generate template data as XML (the Model), Process data submitted by from the XForm (the controller) and display the data in a template (View). This means that every Magneato page consists of two templates: | ||
| + | |||
| + | * An XForms template for editing the data | ||
| + | * A Magneato Display template for showing the data to an end user | ||
| + | |||
| + | ==== Designing the Model ==== | ||
| + | |||
| + | The Model represents how the book demo data will be stored in Magneato and processed by the XForms template. | ||