1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/docs/data.html Tue Jul 19 00:19:38 2005 +0000
1.3 @@ -0,0 +1,101 @@
1.4 +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
1.5 +<html xmlns="http://www.w3.org/1999/xhtml">
1.6 +<head>
1.7 +
1.8 +
1.9 +
1.10 +
1.11 +
1.12 +
1.13 +
1.14 +
1.15 + <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type" />
1.16 +
1.17 +
1.18 +
1.19 +
1.20 +
1.21 +
1.22 +
1.23 +
1.24 +
1.25 +
1.26 +
1.27 +
1.28 + <title>Creating Applications: Design the Structure of the Form Data</title>
1.29 + <meta name="generator" content="amaya 8.1a, see http://www.w3.org/Amaya/" />
1.30 +
1.31 +
1.32 +
1.33 +
1.34 +
1.35 +
1.36 +
1.37 +
1.38 + <link href="styles.css" rel="stylesheet" type="text/css" />
1.39 +</head>
1.40 +
1.41 +
1.42 +<body>
1.43 +
1.44 +
1.45 +
1.46 +
1.47 +<h1>Creating Applications: Design the Structure of the Form Data</h1>
1.48 +
1.49 +
1.50 +
1.51 +
1.52 +<p>Before designing a template, we must first consider how the form
1.53 +data to be modelled in our application will be structured. Let us
1.54 +consider the following hierarchical structure:</p>
1.55 +
1.56 +<ul>
1.57 +
1.58 + <li>A list of items, each containing...<br />
1.59 +
1.60 +
1.61 +
1.62 +
1.63 +
1.64 +
1.65 +
1.66 +
1.67 +
1.68 +
1.69 +
1.70 +
1.71 + <ul>
1.72 +
1.73 + <li>An editable value.</li>
1.74 + <li>A list of subitems, each containing...<br />
1.75 + <ul>
1.76 + <li>An editable value.</li>
1.77 + </ul>
1.78 + </li>
1.79 +
1.80 +
1.81 + </ul>
1.82 +
1.83 +
1.84 +
1.85 +
1.86 +
1.87 +
1.88 + </li>
1.89 +
1.90 +</ul>
1.91 +
1.92 +<p>Since XSLForms is an XML-based framework, let us define this structure using an informal example XML document:</p>
1.93 +<pre><?xml version="1.0"?><br /><structure><br /> <item value="some value"><br /> <subitem subvalue="some other value"/><br /> </item><br /></structure></pre>
1.94 +<p>The above example only shows a single item and a single subitem
1.95 +within it. Our application will provide the ability to add and remove
1.96 +items and subitems, although this is not directly modelled in the XML
1.97 +documents that will be used to represent the form data.</p>
1.98 +<p>With this basic information defined, we can now proceed to <a href="design.html">designing a template</a> in the next stage of the <a href="overview.html">process</a>.</p>
1.99 +
1.100 +
1.101 +
1.102 +
1.103 +</body>
1.104 +</html>
2.1 --- a/docs/design.html Mon Jul 18 22:31:18 2005 +0000
2.2 +++ b/docs/design.html Tue Jul 19 00:19:38 2005 +0000
2.3 @@ -1,145 +1,122 @@
2.4 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.5 <html xmlns="http://www.w3.org/1999/xhtml">
2.6 <head>
2.7 -
2.8 -
2.9 -
2.10 -
2.11 <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type" />
2.12 -
2.13 -
2.14 -
2.15 -
2.16 -
2.17 -
2.18 <title>Creating Applications: Design a Template</title>
2.19 - <meta name="generator" content="amaya 8.1a, see http://www.w3.org/Amaya/" />
2.20 -
2.21 -
2.22 -
2.23 -
2.24 + <meta name="generator"
2.25 + content="amaya 8.1a, see http://www.w3.org/Amaya/" />
2.26 <link href="styles.css" rel="stylesheet" type="text/css" />
2.27 </head>
2.28 -
2.29 -
2.30 <body>
2.31 -
2.32 -
2.33 <h1>Creating Applications: Design
2.34 a Template</h1>
2.35 -
2.36 -
2.37 -<p>To design a template, create a
2.38 +<p>In XSLForms applications, templates are just Web pages with some
2.39 +additional annotations. Thus, to begin the design of a template you can
2.40 +create a
2.41 new Web page using whichever tools or applications you feel most
2.42 comfortable with. Given that XSLForms applications involve Web forms,
2.43 you will obviously need to add forms and fields to your
2.44 -page. In
2.45 -the beginning, it
2.46 -is not that important to use the correct names in each of the fields -
2.47 -these will be added later.</p>
2.48 -
2.49 -
2.50 -<p>The following sections discuss various techniques used in designing a template.</p>
2.51 -<h2>Page Structure</h2>
2.52 -
2.53 -
2.54 -<p>Think about your form in terms
2.55 -of the structure of the data being represented. You may want to have a
2.56 -list of items where each item can be edited by changing a text field
2.57 -and removed by pressing a button next to that field, and you may want
2.58 -to have a button which adds new items to the list. Each item may look
2.59 -like
2.60 -this:</p>
2.61 -
2.62 -
2.63 +page.</p>
2.64 +<p>With a <a href="data.html">structure</a> for the Web forms already
2.65 +defined, we must now concentrate on designing a suitable user interface
2.66 +for the editable items and subitems, along with some mechanisms for
2.67 +adding and removing these things.</p>
2.68 +<h2>The Template Outline</h2>
2.69 +<p>In raw HTML - that is, the code which defines how a Web page is made
2.70 +- we may wish to design the skeleton (or outline) of the page:</p>
2.71 +<pre><?xml version="1.0"?><br /><html xmlns="http://www.w3.org/1999/xhtml"><br /><head><br /> <title>Example</title><br /></head><br /><body><br /><form action="" method="POST"><br /><br /><!-- Template text between the start and the interesting part. --><br /><br /><!-- The interesting part which we will design below. --><br /><br /><!-- Template text between the interesting part and the end. --><br /><br /></form><br /></body><br /></html></pre>
2.72 +<p>Most visual editors for Web pages will add such details
2.73 +automatically when creating a new page, but there are a few things to
2.74 +remember to check:</p>
2.75 +<ul>
2.76 + <li>XSLForms templates must be well-formed XML - you should therefore
2.77 +choose to create XHTML pages. We casually refer to our XHTML templates
2.78 +as being "HTML" throughout this documentation, and the well-formed
2.79 +stipulation is just assumed, but it should be noted that old-style
2.80 +ill-formed HTML, where start and end tags need not match, will <span
2.81 + style="font-style: italic;">not</span> work with XSL transformations
2.82 +and will therefore <span style="font-style: italic;">not</span> work
2.83 +with XSLForms.</li>
2.84 + <li>We add a <code>form</code> element to the outline so that
2.85 +the form fields added later actually perform some function when testing
2.86 +our application.</li>
2.87 +</ul>
2.88 +<h2>Designing the Items</h2>
2.89 +<p>Each of the items presented using the template may employ a simple
2.90 +label and a text field. Alongside these things, we may also wish to
2.91 +have a button which can be pressed to remove that item from its list.
2.92 +The visual representation of this might resemble the following:</p>
2.93 <form method="post" action="none" name="structure">
2.94 -
2.95 -
2.96 <p>Some
2.97 -item: <input name="value" value="some value" /><input name="remove" value="Remove" type="submit" />
2.98 - </p>
2.99 -
2.100 -
2.101 +item: <input name="value" value="some value" /><input name="remove"
2.102 + value="Remove" type="submit" /> </p>
2.103 </form>
2.104 -
2.105 -
2.106 -<p>The HTML code which produces this item in a Web page might look like this:</p>
2.107 -
2.108 -
2.109 -<pre><html xmlns="http://www.w3.org/1999/xhtml"><br /><head><br /> <title>Example</title><br /></head><br /><body><br /><br /><!-- Template text between the start and the interesting part. --><br /><br /><form action="" method="POST"><br /><p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /></p><br /><br /><!-- Template text between the interesting part and the end. --><br /><br /></form><br /></body><br /></html></pre>
2.110 -
2.111 -
2.112 -<p>Although you will only need to
2.113 -"paint" one such item in the document, you should imagine that when
2.114 -many such items are presented they will be produced by copying the form
2.115 -of the original item; thus, the details of that item should reside in
2.116 -an HTML element which can be replicated many times at a particular
2.117 -position in a document, like this:</p>
2.118 -
2.119 -
2.120 -<pre><p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /></p><br /><p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /></p><br /><p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /></p></pre>
2.121 -
2.122 -
2.123 -<p>Making sure that the final form of the list is sensible HTML code is
2.124 -an activity explored <a href="structure.html">later</a> in the
2.125 -development <a href="overview.html">process</a>.</p>
2.126 -
2.127 -
2.128 -<h2>Hierarchical Structures</h2>
2.129 -
2.130 -
2.131 -<p>Although we need not consider the structure of the template too
2.132 -deeply, given the above advice about how structure should be
2.133 -represented in HTML, it is interesting to consider hierarchical or
2.134 -nested structures. For example, each item in a list may itself contain
2.135 -a number of other items; for example:</p>
2.136 -
2.137 -
2.138 +<p>The HTML code which produces this representation might look like
2.139 +this:</p>
2.140 +<pre><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /></div></pre>
2.141 +<p>Although we have given names to the different <code>input</code>
2.142 +elements, it
2.143 +is actually not that important to use the correct names at this stage
2.144 +in the development process - the actual names will be added later.</p>
2.145 +<p><span style="font-weight: bold;">One important thing to note</span>
2.146 +is that the item is defined within a single top-level HTML element -
2.147 +the significance of this will become clear later on.</p>
2.148 +<h2>Designing the Subitems</h2>
2.149 +<p>In the structure of the form data, we decided to have lists of
2.150 +subitems belonging to each item. To achieve this, we can thus extend
2.151 +the above design for the items by adding some additional text and a
2.152 +similar label, field and button arrangement for each of the subitems.
2.153 +For example:</p>
2.154 <form method="post" action="none" name="hierarchical">
2.155 -
2.156 -
2.157 - <p>Some item: <input name="value" value="some value" /><input name="remove" value="Remove" type="submit" /></p>
2.158 -
2.159 -
2.160 -
2.161 -
2.162 + <p>Some item: <input name="value" value="some value" /><input
2.163 + name="remove" value="Remove" type="submit" /></p>
2.164 <p>Itself containing more items:</p>
2.165 -
2.166 -
2.167 -
2.168 -
2.169 - <p>Sub-item: <input name="subvalue" value="some other value" /><input name="remove2" value="Remove" type="submit" /></p>
2.170 -
2.171 -
2.172 + <p>Sub-item: <input name="subvalue" value="some other value" /><input
2.173 + name="remove2" value="Remove" type="submit" /></p>
2.174 </form>
2.175 -
2.176 -
2.177 -<p>Given that the whole of the above fragment is a single item in a
2.178 -list, to ensure that the above advice is heeded about items being
2.179 -easily replicated, we need to enclose the fragment in a single HTML
2.180 -element, like this:</p>
2.181 -
2.182 -
2.183 -<pre><html xmlns="http://www.w3.org/1999/xhtml"><br /><head><br /> <title>Example</title><br /></head><br /><body><br /><form action="" method="POST"><br /><br /><!-- Template text between the start and the interesting part. --><br /><br /><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Itself containing more items:<br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /></div><br /><br /><!-- Template text between the interesting part and the end. --><br /><br /></form><br /></body><br /></html></pre>
2.184 -
2.185 -
2.186 +<p>This representation might be expressed in HTML as follows:</p>
2.187 +<pre><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Itself containing more items:<br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /></div><br /></pre>
2.188 <p>In the above example, the <code>div</code> element encloses the
2.189 outer list item. Meanwhile, the inner list item is itself enclosed
2.190 within a <code>p</code> element in the same way as the original
2.191 -example enclosed its simple list item. Consider the above example with
2.192 -replicated items:</p>
2.193 -
2.194 -
2.195 -<pre><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Itself containing more items:<br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /></div><br /><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Itself containing more items:<br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /></div><br /></pre>
2.196 -
2.197 -
2.198 +example enclosed its simple list item.</p>
2.199 +<p><span style="font-weight: bold;">It should be noted</span> that
2.200 +the item and subitem are each defined within single enclosing
2.201 +HTML elements - as noted above, the motivation for this will become
2.202 +clear later on.</p>
2.203 +<h2>Adding Items and Subitems</h2>
2.204 +<p>Our chosen user interface for adding items and subitems is through
2.205 +the use of buttons under each list.
2.206 +We can thus extend our visual representation to incorporate such
2.207 +details. For example:
2.208 +</p>
2.209 +<form method="post" action="none" name="hierarchical">
2.210 + <p>Some item: <input name="value" value="some value" /><input
2.211 + name="remove" value="Remove" type="submit" /></p>
2.212 + <p>Itself containing more items:</p>
2.213 + <p>Sub-item: <input name="subvalue" value="some other value" /><input
2.214 + name="remove2" value="Remove" type="submit" /></p>
2.215 + <p><input name="add2" value="Add subitem" type="submit" /></p>
2.216 + <p><input name="add" value="Add item" type="submit" /></p>
2.217 +</form>
2.218 +<p>This representation might be expressed in HTML as follows:</p>
2.219 +<pre><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Itself containing more items:<br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /> <p><br /> <input name="add2" type="submit" value="Add subitem" /><br /> </p><br /></div><br /><p><br /> <input name="add" type="submit" value="Add item" /><br /></p><br /></pre>
2.220 +<p>In the above example, the new buttons have been added alongside the
2.221 +elements which define the subitem and item regions of the template.
2.222 +Thus, the <code>input</code> field called <code>add2</code>
2.223 +which adds subitems is alongside, not inside, the <code>p</code>
2.224 +element which defines the subitem region of the template. Likewise,
2.225 +the <code>input</code> field called <code>add</code> which
2.226 +adds items is alongside, not inside, the <code>div</code> element
2.227 +which defines the item region of the template.</p>
2.228 <h2>Saving the Template</h2>
2.229 -
2.230 -
2.231 +<p>Adding the above modifications to the outline, we end up with the
2.232 +following HTML code:</p>
2.233 +<pre><?xml version="1.0"?><br /><html xmlns="http://www.w3.org/1999/xhtml"><br /><head><br /> <title>Example</title><br /></head><br /><body><br /><form action="" method="POST"><br /><br /><!-- Template text between the start and the interesting part. --><br /><br /><div><br /> <p><br /> Some item: <input name="value" type="text" value="some value" /><br /> <input name="remove" type="submit" value="Remove" /><br /> </p><br /> <p><br /> Itself containing more items:<br /> </p><br /> <p><br /> Sub-item: <input name="subvalue" type="text" value="some other value" /><br /> <input name="remove2" type="submit" value="Remove" /><br /> </p><br /> <p><br /> <input name="add2" type="submit" value="Add subitem" /><br /> </p><br /></div><br /><p><br /> <input name="add" type="submit" value="Add item" /><br /></p><br /><br /><!-- Template text between the interesting part and the end. --><br /><br /></form><br /></body><br /></html></pre>
2.234 <p>Once you are happy with the
2.235 design of the page, save it to the <a href="directory.html">directory</a>
2.236 -created earlier, then proceed to <a href="structure.html">adding structure information</a> in the next stage of the <a href="overview.html">process</a>.</p>
2.237 -
2.238 -
2.239 +created earlier, then proceed to <a href="structure.html">adding
2.240 +structure information</a> in the next stage of the <a
2.241 + href="overview.html">process</a>.</p>
2.242 </body>
2.243 </html>
3.1 --- a/docs/directory.html Mon Jul 18 22:31:18 2005 +0000
3.2 +++ b/docs/directory.html Tue Jul 19 00:19:38 2005 +0000
3.3 @@ -50,7 +50,7 @@
3.4
3.5 <th style="text-align: right;">A top-level directory corresponding to a Python package</th>
3.6
3.7 - <td style="background-color: rgb(204, 204, 255); border-top-style: solid; border-left-style: solid; border-right-style: solid; border-right-width: 1px; border-left-width: 1px; border-top-width: 1px;" align="undefined" valign="undefined"><span style="font-weight: bold;">Configurator</span><br />
3.8 + <td style="background-color: rgb(204, 204, 255); border-top-style: solid; border-left-style: solid; border-right-style: solid; border-right-width: 1px; border-left-width: 1px; border-top-width: 1px;" align="undefined" valign="undefined"><span style="font-weight: bold;">VerySimple</span><br />
3.9 __init__.py</td>
3.10
3.11 <td align="undefined" valign="undefined"></td>
3.12 @@ -79,7 +79,7 @@
3.13 <p>For the above example, the directory structure would be created using UNIX-style commands as follows:</p>
3.14
3.15
3.16 -<pre>mkdir Configurator<br />mkdir Configurator/Resources<br />touch Configurator/__init__.py</pre>
3.17 +<pre>mkdir VerySimple<br />mkdir VerySimple/Resources<br />touch VerySimple/__init__.py</pre>
3.18
3.19
3.20 <p>It is in the <code>Resources</code> subdirectory that we will save
4.1 --- a/docs/model.html Mon Jul 18 22:31:18 2005 +0000
4.2 +++ b/docs/model.html Tue Jul 19 00:19:38 2005 +0000
4.3 @@ -3,11 +3,16 @@
4.4 <head>
4.5
4.6
4.7 +
4.8 +
4.9
4.10
4.11 <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type" />
4.12
4.13
4.14 +
4.15 +
4.16 +
4.17
4.18
4.19
4.20 @@ -16,6 +21,8 @@
4.21 <meta name="generator" content="amaya 8.1a, see http://www.w3.org/Amaya/" />
4.22
4.23
4.24 +
4.25 +
4.26
4.27
4.28 <link href="styles.css" rel="stylesheet" type="text/css" />
4.29 @@ -23,34 +30,63 @@
4.30
4.31
4.32 <body>
4.33 +
4.34 <h1>The XSLForms Conceptual Model</h1>
4.35
4.36 -<p>In applications based on XSLForms, form data is processed as XML documents as shown in the following diagram:</p>
4.37 +
4.38 +<p>In applications based on XSLForms, form data is modelled and processed as XML documents as shown in the following diagram:</p>
4.39 +
4.40 <table style="text-align: left; width: 80%;" align="center" border="0" cellpadding="5" cellspacing="5">
4.41 +
4.42 <tbody>
4.43 +
4.44 <tr>
4.45 +
4.46 <td align="undefined" valign="undefined"></td>
4.47 +
4.48 <th style="border: 1px solid rgb(0, 0, 0); background-color: rgb(193, 255, 102); text-align: center; vertical-align: top;">Application<br />
4.49 +
4.50 <span class="method">Starting with an initial XML document...</span></th>
4.51 +
4.52 <th style="text-align: center; vertical-align: top;">XSLForms<br />
4.53 +
4.54 <span class="method">A template is used together with the XML document to produce a Web page...</span></th>
4.55 +
4.56 <th style="border: 1px solid rgb(0, 0, 0); background-color: rgb(255, 204, 255); text-align: center; vertical-align: top;">Browser<br />
4.57 +
4.58 <span class="method">The Web page contains a form which is filled out by users of the application and submitted back to the application...</span></th>
4.59 +
4.60 </tr>
4.61 +
4.62 <tr>
4.63 +
4.64 <th style="text-align: center; vertical-align: top;">XSLForms<br />
4.65 +
4.66 <span class="method">The incoming form data is converted to an XML document...</span></th>
4.67 +
4.68 <th style="border: 1px solid rgb(0, 0, 0); background-color: rgb(193, 255, 102); text-align: center; vertical-align: top;">Application<br />
4.69 +
4.70 <span class="method">The incoming XML document is processed, validated, and so on...</span></th>
4.71 +
4.72 <th style="text-align: center; vertical-align: top;">XSLForms<span class="method">A template is used together with the new XML document to produce a Web page...</span></th>
4.73 +
4.74 <th style="border: 1px solid rgb(0, 0, 0); background-color: rgb(255, 204, 255); text-align: center; vertical-align: top;">Browser<span class="method">An updated Web page is shown to the user. The page may contain a form which may be filled out and submitted...</span></th>
4.75 +
4.76 </tr>
4.77 +
4.78 +
4.79 </tbody>
4.80 </table>
4.81 +
4.82 <p>The XSLForms framework therefore performs two main functions:</p>
4.83 +
4.84 <ul>
4.85 +
4.86 <li>To present XML documents as Web pages containing forms.</li>
4.87 +
4.88 <li>To interpret submitted Web form information and to convert that information to XML.</li>
4.89 +
4.90 </ul>
4.91 +
4.92 </body>
4.93 </html>
5.1 --- a/docs/overview.html Mon Jul 18 22:31:18 2005 +0000
5.2 +++ b/docs/overview.html Tue Jul 19 00:19:38 2005 +0000
5.3 @@ -2,14 +2,21 @@
5.4 <html xmlns="http://www.w3.org/1999/xhtml">
5.5 <head>
5.6
5.7 +
5.8 +
5.9
5.10 <meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type" />
5.11
5.12 +
5.13 +
5.14 +
5.15
5.16
5.17 <title>Creating Applications: An Overview</title>
5.18 <meta name="generator" content="amaya 8.1a, see http://www.w3.org/Amaya/" />
5.19
5.20 +
5.21 +
5.22
5.23 <link href="styles.css" rel="stylesheet" type="text/css" />
5.24 </head>
5.25 @@ -17,43 +24,61 @@
5.26
5.27 <body>
5.28
5.29 +
5.30 <h1>Creating Applications: An Overview</h1>
5.31
5.32 +
5.33 <p>The following steps briefly describe how to make a new application:<br />
5.34
5.35 +
5.36 </p>
5.37
5.38 +
5.39 <ol>
5.40
5.41 +
5.42 <li><a href="directory.html">Create a directory to hold your files</a></li>
5.43 + <li><a href="data.html">Design the structure of the form data</a></li>
5.44 +
5.45
5.46 <li><a href="design.html">Design a template</a></li>
5.47
5.48 +
5.49 <li><a href="structure.html">Add structure to the template</a></li>
5.50 +
5.51 <li><a href="selectors.html">Add selectors to the template</a></li>
5.52
5.53 +
5.54 <li><a href="catalogues.html">Prepare catalogues of multiple-choice
5.55 values</a></li>
5.56
5.57 +
5.58 <li><a href="Web-resource.html">Write a Web resource to display the
5.59 form</a></li>
5.60
5.61 +
5.62 </ol>
5.63
5.64 +
5.65 <h2>Recommendations</h2>
5.66
5.67 +
5.68 <ol>
5.69
5.70 +
5.71 <li>Where multiple fields exist and can be added and removed, put
5.72 them inside a separate element so that the selectors can successfully
5.73 identify them. Otherwise, changing element orders can result in the
5.74 wrong element being selected.</li>
5.75
5.76 +
5.77 <li>Make sure that transformations on the input document produce all
5.78 the necessary elements for the output document so that the resulting
5.79 page gives the user the opportunity to specify data that is missing.</li>
5.80
5.81 +
5.82 </ol>
5.83
5.84 +
5.85 </body>
5.86 </html>