It is not easy for web programmers to write HTML-based web interfaces.
The current web forms in HTML have not been greatly improved to cope with
the increasing demands since 1993, leaving it up to the programmer to manually enhance
the functionality through scripting. Scripting can help sometimes,
but not everyone is a JavaScript (ECMAScript) expert.
Generating documents dynamically is extremely difficult when
a substantial part of the document consists of script and not markup.
Stack Overflow felt the need for a more powerful forms
language. HTML and Scripting is powerful but too costly for developing
complex applications. The idea is to redefine the
functionality available in JavaScript and beyond into a new markup language. This will keep the costs
for authors down while offering richer features than is normally
feasible in HTML.
The designers of XHTML-FML wanted to keep as close to HTML as possible to minimize the
learning curve for authors. This approach is via a small set of
modules. The FML modules are fully compatible with the modularization framework in XHTML
and aim to provide a better alternative to HTML 4.0 forms, frames and scripting.
XHTML-FML has real benefits for authors who want to construct
sophisticated web forms and dynamic web pages comfortably
using a markup language instead of tiresome
cross-browser scripting.
At the moment (the time this document is being published),
the HTML Working Group is working on the next generation
of web forms, XHTML Extended Forms (XForms).
Stack Overflow has been playing an active role in this development and
will continue to contribute to this effort.
The Forms Subgroup within the HTML Working Group has recently released
the requirements for XHTML Extended Forms [XFORMSREQ]. XHTML-FML
already provides the necessary functionality to satisfy
a number of key requirements for XForms.
The positive response from authors on XHTML-FML has encouraged
Stack Overflow to continue the development of XHTML-FML within the W3C,
letting the new XForms benefit from the experience and feedback gained from XHTML-FML.
Since some of the concepts realized in XHTML-FML will continue to exist in
XHTML Extended Forms, future versions of XHTML-FML will utilize modules from XForms
as they become available. Although some modules in FML are likely to be replaced by
XForms modules providing greater functionality,
other parts of FML will continue to exist as extensions to XForms.
The Modularization of XHTML is a framework for the construction of
XHTML family members. Extended Forms in XHTML
will be defined as one or several modules that can be combined with the
existing modules of XHTML 1.1. Prior to this,
XHTML-FML will define a set of FML modules that can be used with
XHTML 1.1.
The collection of names contained in the above FML modules define the
FML Namespace. The FML Namespace is defined at the following URI:
Although the Forms Markup Language defines its own namespace,
FML cannot exist as a stand-alone markup language. Rather,
FML can be used in addition to other markup languages (e.g., SMIL) or
any XHTML family member.
This document describes a specific combination of FML with XHTML.
This specific combination is the XHTML-FML 1.0 Document Type.
The XHTML-FML 1.0 Document Type is identified by the formal public identifier (FPI):
The FML Modules are currently implemented as XHTML-conforming DTD Modules.
The DTD Modules attached to this document under Appendix A define the FML
element names in their pure, uncolonized form under the FML Namespace.
These modules are the basis for FML being used in a different context than XHTML-FML 1.0
The specific combination of XHTML and FML, XHTML-FML 1.0, described in this document
assigns the character x as the namespace prefix for the FML names in XHTML-FML,
the default namespace being the XHTML namespace. The XHTML-FML 1.0 DTD Driver and monolithic DTD
under Appendix B in this document define the FML element names with this namespace
prefix. The examples in this document show the FML element names in their colonized form, as
defined in XHTML-FML 1.0. This document describes FML attributes, elements and event handler
separetely to avoid redundancy; cross references are made where apprporiate.
The textoutput element is the same as the textinput element, except that it is rendered as normal text
and the user can not directly change the value of the "value" attribute. This is most useful
when the "value" is changed either by a calc or by a toggle with the attribute shared="yes".
The label element may be used to attach information to controls. Each label element is associated
with exactly one form control. The for attribute associates a label with another control explicitly:
the value of the for attribute must be the same as the value of the id attribute of the associated
control element. More than one label may be associated with the same control by creating multiple
references via the for attribute.
If mandatory is set to yes and the form control has a label then the alert will show a
list of labels instead of IDs.
A list of radios allows the user to select a single item.
A list of checkboxes allows the user to select several items.
A list of options within a pulldown allows the user to select a single
option.
A list of options within a listbox allows the user to select several
options.
1.13.2 Content
- empty
1.13.3 Attributes
- ID
- Value
1.13.3 Sample Code
<hidden id="foo" value="remember this" />
2.1.1 Description
The <calc> element enables a client-side
calculation using a mathematical expression and the values of other
form elements.
The result can then be given to a <x:textoutput> that is nested within the
calc.
2.1.2 Content
- form controls
2.1.3 Attributes
- ID
- Term
- Value
- Digits
- Send
2.1.3 Sample Code
<calc id="foo" term="field1 * field2">
<textoutput />
</calc>
3.1.1 Description
The <img> element embeds an image in the document at the
location where the element is defined. It is mostly the same
as in HTML 4.0, except for the addition of the
preload attribute. This is needed to
load images before the screen page finishes being
displayed, since FML documents can contain multiple screen pages
in a single document.
3.1.2 Content
- empty
3.1.3 Attributes
- ID
- Src
- Alt
- Width
- Height
- Align
- Onclick
- Preload
3.1.3 Sample Code
<img id="foo" src="http://www.server.ext/MyImage.gif" alt="My Image" preload="yes" onclick="..." />
4.1.1 Description
The <template> element marks out a section
of elements or tagset which will appear repeatedly in the document. The template
is defined only once and invoked with the <insert>
element as often as needed. Inside the template placeholders can be defined using
strings enclosed in pipes ("|").
4.1.2 Content
- plain text
- block elements
- inline elements
- <tr>
- <td>
- <x:tg>
4.1.3 Attributes
- ID
4.1.3 Sample Code
<template id="foo">
<textinput value="|repl|" />
...
</template>
4.2.1 Description
The <insert> element pastes a
predefined template in the position where the insert is specified.
4.2.2 Content
- <x:prop>
4.2.3 Attributes
- ID
- Template
4.2.3 Sample Code
<insert template="foo">
<prop name="repl">
content to fill in...
</prop>
...
</insert>
4.3.1 Description
The content of the <prop> element changes
a placeholder in a predefined template when the template is inserted into a
location defined by an <insert>.
4.3.2 Content
- plain text
4.3.3 Attributes
- ID
- Name
4.3.3 Sample Code
<insert template="foo">
<prop name="repl">
content to fill in...
</prop>
...
</insert>
5.1.1 Description
The <toggle> element is used to switch
through multiple parts of a document or even pages without
requesting new data from the server. All the data is contained in
the document, but not all of it is displayed until it becomes active through an event
activated by toggling.
5.1.2 Content
- form controles
- <x:tg>
- <x:insert>
- <x:img>
5.1.3 Attributes
- ID
- Value
- shared
5.1.3 Sample Code
<toggle id="no1">
<img src="..." alt="First image" id="img1" />
<img src="..." alt="Second image" id="img2" />
</toggle>
5.2.1 Description
Within a <tg> (toggle group),
arbitrary elements that behave as one group when toggled are defined.
5.1.2 Content
- plain text
5.2.3 Attributes
- ID
- Style
- Class
5.2.3 Sample Code
<toggle id="togglegroup">
<tg id="img1">
Title of first image:
<img src="..." alt="First image" id="img1" />
</tg>
<tg id="img2">
Title of second image<
<img src="..." alt="Second image" id="img2" />
</tg>
</toggle>
6.1.1 Description
Unique identifier. The ID attribute corresponds to the ID attribute type as defined in
XML. IDs provide a means to unambiguously identify
element instances. In the FML context, the ID replaces the HTML FORM "name"
(see HTML 4.01 Specification).
Allowed values: subject to XML ID restrictions.
6.1.2 Used in following elements:
6.1.3 Sample Code
6.2.1 Description
Attribute containing the value of the element corresponds to HTML 4.01 form values (reference see previous).
Typically this value is sent back to the server. Allowed types: plain text.
6.2.2 Used in following elements:
6.2.3 Sample Code
<x:textoutput id="foo" value="click here" />
6.3.1 Description
The style attribute for CSS-statements. as reference see HTML 4.01. specification.
Allowed types: plain text, though only legal CSS statements will produce
an effect (see also CSS specification).
6.3.2 Used in following elements:
6.3.3 Sample Code
<x:tg id="foo" style="font-family:Arial;" />Attention!</x:tg>
6.4.1 Description
The class attribute for CSS statements. See HTML 4.01.
Allowed types: plain text, though only legal CSS statements will produce
an effect (see also CSS specification).
6.4.2 Used in following elements:
6.4.3 Sample Code
<x:textoutput id="foo" value="Next" class="footer" onclick="toggle:chapter1,+;" />
6.5.1 Description
It is technically very difficult to check whether an e-mail address is not only syntactically correct but
also valid. The only reliable method is to send an e-mail to the address and ask the receiver to reply.
xxxxxx ANFANG
Dennoch ermöglicht das ctype attribute eine clientseitige Vorab-Prüfung der Eingabe. So muss zum Beispiel
ein @ dabei sein, um die Voraussetzungen des ctype-typus email zu erfüllen.
xxxxxx ENDE
The ctype attribute allows the choice of a predefined input validation type:
'email' (e.g., john@doe.com)
'text' (for non-numeric text strings)
'num' (for numbers only)
'date' (for dates of type: DD.MM.YY / DD.MM.YYYY / DD/MM/YY / DD/MM/YYYY)
'url' (e.g., http://www.domain.com)
'www' (e.g., www.domain.com)
'creditcard' (for the 15 or 16 digits of a credit card number)
'expiredate' (for the credit card expiry date of the type: MM/YY)
'all' (input anything) - default setting.
6.5.2 Used in following elements:
6.5.3 Sample Code
<x:textinput id="foo" value="Enter here..." ctype="email" validation="strict" />
6.6.1 Description
xxxxxx ANFANG
In Beziehung zu ctype kann dieses Attribut die "Strenge" der
ctype Validierung bestimmen.
xxxxxx ENDE
There are two levels of validation: strict and loose.
Once the user hits the OK button in the validation alert, the incorrect
data is deleted.
If validation is set to strict, the user must either enter data
matching the validation criteria or no data at all.
When validation is set to loose, the
incorrect data still remains in the form control after the alert has appeared. The user
is informed that the data is incorrect but can still proceed and leave the data
as it is.
Legal entry: loose / strict / none. Default: none.
6.6.2 Used in following elements:
6.6.3 Sample Code
<x:textinput id="foo" value="Enter here..." ctype="email" validation="strict" />
6.7.1 Description
This attribute defines the width of a textinput in characters (legal entry: numbers).
6.7.2 Used in following elements:
6.7.3 Sample Code
<x:textinput id="foo" value="Enter here!" size="12" />
6.8.1 Description
The vertical size of a textarea or listbox is expressed in number of rows. A row is one line of text. Legal entry: numbers.
6.8.2 Used in following elements:
6.8.3 Sample Code
<x:listbox id="foo" rows="6" cols="8" />
6.9.1 Description
The horizontal size of a textarea is expressed in number of characters. Legal entry: numbers.
6.9.2 Used in following elements:
6.9.3 Sample Code
<x:textarea id="foo" rows="6" cols="8">Enter here...</x:textarea>
6.10.1 Description
The send attribute defines whether the value of a form element will be sent back to the server or not on pressing the submit button.
Legal entry: yes/no (default: yes).
6.10.2 Used in following elements:
6.10.3 Sample Code
Your name:
<x:textinput id="name" size="30" send="yes" />
6.11.1 Description
This attribute specifies the form element as 'required'.
xxxxxx ANFANG
Der Benutzer muss bei diesen entsprechenden Form Feldern einen Eintrag tätigen, da sonst das Formular nicht absendbar ist.
xxxxxx ENDE
Legal entry: yes/no (default: no)
6.11.2 Used in following elements:
6.11.3 Sample Code
<x:textinput id="name" size="30" send="true" mandatory="yes" />
6.12.1 Description
Marks the <item> within a radio or checkbox element
as 'checked'. Legal entry: yes/no. Default: no.
6.12.2 Used in following elements:
6.12.3 Sample Code
<x:radio id="foo" >
<x:item checked="yes">Version 1</x:item>
<x:item>Version 2</x:item>
</x:radio>
6.13.1 Description
Marks the <option> within a pulldown or listbox element
as 'selected'. Legal entry: yes/no. Default: no.
6.13.2 Used in following elements:
6.13.3 Sample Code
<x:listbox id="foo" >
<x:option selected="yes">Version 1</x:option>
<x:option>Version 2</x:option>
</x:listbox>
6.14.1 Description
This attribute specifies a form processing agent (legal entry: URI).
For reference see also: http://www.w3.org/TR/html401/interact/forms.html
6.14.2 Used in following elements:
6.14.3 Sample Code
<x:form id="orderform" action="http://www.mozquito.org/servlets/Echo" />
6.15.1 Description
This attribute specifies which HTTP method will be used to
submit the form data set. Possible (case-insensitive)
values are "get" (the default) and "post".
6.15.2 Used in following elements:
6.15.3 Sample Code
<x:form id="orderform" action="http://www.mozquito.org/servlets/Echo" method="post" />
6.16.1 Description
This attribute specifies the content type used to submit
the form to the server (when the value of method is
"post"). The default value for this attribute is "application/x-www-form-urlencoded".
6.16.2 Used in following elements:
6.16.3 Sample Code
<x:form id="orderform" action="http://www.mozquito.org/servlets/Echo"
method="post" enctype="application/x-www-form-urlencoded" />
6.17.1 Description
This attribute explicitly associates the <label>
being defined with another control.
When present, the value of this attribute must be the same as the value of the id
attribute of some other control in the same document. When absent, the
<label> being
defined is associated with the element's contents.
The value of the for attribute is the same as the associated form control’s ID.
Legal value: ID reference (see specification
as with ID attribute.
6.17.2 Used in following elements:
6.17.3 Sample Code
<x:label for="name">Your name</x:label>:
6.18.1 Description
Within the calc element this attribute defines the number
of digits in the results of a calculation. Valid entry: numbers.
6.18.2 Used in following elements:
6.18.3 Sample Code
<x:calc id="sum" term="unitprice * quantity" send="true" digits="2">
<x:textoutput />
</x:calc>
6.19.1 Description
The term attribute includes any mathematical expression with numbers and the IDs of other FML form controls.
It can include every legal JavaScript term. In the term, JavaScript variables must be surrounded by spaces.
6.19.2 Used in following elements:
6.19.3 Sample Code
<x:calc id="sum" term=" 138 + 14 " send="true">
<x:textoutput />
</x:calc>
6.20.1 Description
This attribute specifies the location of an image file (legal entry: URI) due to the
HTML 4 specification.
6.20.2 Used in following elements:
6.20.3 Sample Code
<x:img id="foo" alt="Maggie Cheung" src="images/01.jpg" preload="yes" width="112" height="213" />
6.21.1 Description
The alt attribute specifies alternate text that is displayed
when the image cannot be displayed (legal entry: plain text).
See HTML 4 specification.
6.21.2 Used in following elements:
6.21.3 Sample Code
<x:img id="foo" alt="Anita Mui" src="images/02.jpg" preload="yes" width="112" height="213" />
6.22.1 Description
This defines the image width (optional but required when 'preload' is 'true'). Legal entry: numbers (+ units).
Default: pixel. See HTML 4 specification.
6.22.2 Used in following elements:
6.22.3 Sample Code
<x:img id="foo" alt="Michelle Yeoh" src="images/03.jpg" preload="yes" width="112" height="213" />
6.23.1 Description
This defines the height of the image (optional but required when 'preload' is 'true').
Legal entry: numbers (+ units). Default: pixel.
See HTML 4 specification.
6.23.2 Used in following elements:
6.23.3 Sample Code
<x:img id="foo" alt="Gong Li" src="images/04.jpg" preload="yes" width="112" height="213" />
6.24.1 Description
The align attribute specifies an alignment of the image in context (values: left, right, center).
See HTML 4 specification.
6.24.2 Used in following elements:
6.24.3 Sample Code
<x:img id="foo" alt="Joan Chen" src="images/05.jpg" preload="yes" width="112" height="213" />
6.25.1 Description
The preload attribute specifies whether images should be loaded
or not when the document is initially loaded (values: yes/no, default: no).
6.25.2 Used in following elements:
6.25.3 Sample Code
<x:img id="foo" alt="Bai Ling" src="images/06.jpg" preload="yes" width="112" height="213" />
6.26.1 Description
If shared is set to yes then all FML forms controls inside the toggle
share the same value. If the value of one form control changes, the values of all other
form controls are adjusted automatically.
When the page visitor changes the value of the text input control, the value of the pulldown
is changed automatically. Since the value is different than any of the given option's values,
a new option is created.
Legal entry: yes/no (default: no).
6.26.2 Used in following elements:
6.26.3 Sample Code
<x:toggle id="openlist" shared="true">
<x:textinput value="Enter here..." />
<x:textoutput />
</x:toggle />
6.27.1 Description
The id of a predefined template. This attribute is used
to identify which template is being referenced.
6.27.2 Used in following elements:
6.27.3 Sample Code
<x:insert template="foo"></x:insert>
6.28.1 Description
Corresponds with the string enclosed within pipes ("|"), specified as a placeholder in the template.
Legal entry: plain text.
6.28.2 Used in following elements:
6.28.3 Sample Code
<x:insert template="foo">
<prop name="birthday">13.4.1947</x:prop>
</x:insert>
6.29.1 Description
The onclick event occurs if the mouse button presses a button.
The event handler onclick specifies what happens if the user pushes the button.
If the form is to submit, the submit action statement is used as the
value of the onclick attribute (submit:MyForm). After the submit key word
and the colon, the ID of the form to be submitted must be given.
6.29.2 Used in following elements:
6.29.3 Sample Code
<x:button id="foo" onclick="toggle:MyToggle,2;" />
6.30.1 Description
The onchange event handler is activated when you change the value either of a
<x:textinput> or a <x:textarea> and exit the field. With that
and with onclick you can easily toggle between <x:textinput> and
<x:textoutput> if the content (value) has been changed.
6.30.2 Used in following elements:
6.30.3 Sample Code
<x:textinput size="20" id="more" onchange="toggle:openlist" />
6.31.1 Description
The onfocus event occurs when an element receives focus either by the pointing device
or by tabbing navigation (e.g., the cursor is placed into a textinput element).
6.31.2 Used in following elements:
6.31.3 Sample Code
<x:textarea id="foo" onfocus="validate;" />
6.32.1 Description
The onblur event occurs when an element loses focus either by the pointing device or by tabbing navigation.
It may be used with the same elements as onfocus.
6.32.2 Used in following elements:
6.32.3 Sample Code
<x:textinput id="foo" onblur="validate;" />
6.33.1 Description
XXXXXX ANFANG
Das Attribut onshow bestimmt, wie sich ein Toggle zu verhalten hat in dem Augenblick in dem das Element, das
onshow in sich trägt auf dem Monitor erscheint. So kann zum Beispiel in einem Ablauf, der durch einen
Forwärts- und Rückwärtsbutton gesteuert wird erreicht werden, dass zu Beginn des Ablaufs der Rückwärtsbutton nicht angezeigt wird
und am ende der Vorwärtsbutton verschwindet.
ENDE xxxxxx
6.33.2 Used in following elements:
6.33.3 Sample Code
<x:onshow="toggle:backbutton;" />
6.34.1 Description
XXXXXX ANFANG
Das Attribut onhide bestimmt, wie sich ein Toggle zu verhalten hat in dem Augenblick in dem das Element, das
onhide in sich trägt wieder vom Monitor verschwindet. So kann zum Beispiel in einem Ablauf, der durch einen
Forwärts- und Rückwärtsbutton gesteuert wird erreicht werden, dass zu Beginn des Ablaufs der Rückwärtsbutton nicht angezeigt wird
und am Ende der Vorwärtsbutton verschwindet.
ENDE xxxxxx
6.34.2 Used in following elements:
6.34.3 Sample Code
<x:onhide="toggle:backbutton;" />
All action statements can appear as the value of an event handler attribute.
An example of syntax:
<textinput onchange="action:statement" />
7.1.1 Description
This action statement tells toggle element to switch to the
next phase. Within an event handler, the id of the referenced toggle element
is given after the action keyword toggle:. After
the id string, it is possible to define which toggle group within the toggle
element should be displayed. Every element or toggle group nested within a
toggle is indexed as an array, where the first element has the index "0".
Instead of telling the toggle where to jump directly by providing the desired
element's array index, it also possible to toggle back and
forth through the array with "-" and "+".
7.1.2 Sample Code
<toggle id="images">
<img src="..." alt="First image" id="img1" />
<img src="..." alt="Second image" id="img2" />
<img src="..." alt="Third image" id="img3" />
</toggle>
<button value="show next image" onclick="toggle:images,+" />
<button value="show previous image" onclick="toggle:images,-" />
<button value="show first image" onclick="toggle:images,0" />
<button value="show third image" onclick="toggle:images,2" />
7.2.1 Description
The setval action is used to change the value
of a form control with an event handler. With this action statement, it is
possible to modify any value immediately.
7.2.1 Sample Code
<textoutput id="MyString" value="Hello World" />
...
<button value="Change" onclick="setval:MyString,Hello Again!" />
7.3.1 Description
The reset action changes the values of all form
controls to their default value. This is similar to the
<input type="reset"> button in HTML 4 Forms.
See also HTML 4.01 reference.
7.3.2 Sample Code
<form id="MyForm">
...
<button value="Reset" onclick="reset:MyForm" />
</form<
7.4.1 Description
The reset action submits the form to the specified
location defined in the action attribute of the form. This is
similar to the <input type="submit"> button in
HTML 4 Forms.
See also HTML 4.01 reference.
7.4.2 Sample Code
<form id="MyForm">
...
<button value="Submit!" onclick="submit:MyForm" />
</form>
7.5.1 Description
The alert action displays an alert dialog
window when triggered. The user must click on the "OK"
button of the alert window to proceed.
7.5.2 Sample Code
<button value="Alert" onclick="alert:This message appears!" />
7.6.1 Description
The prompt specifies a prompt string for the input field.
It creates a single input text string. This is used for adding a "free input" option to pulldowns
and listboxes.
7.5.2 Sample Code
<listbox id="food">
<option>Steak</option>
<option>Sushi</option>
<option>Vegetables</option>
<option>Burger</option>
<option onclick="prompt:food,It's your turn!">[ - your entry - ]</option>
</listbox>
<!-- ...................................................................... -->
<!-- FML 1.0 Forms Markup Language Model ................................ -->
<!-- file: FML1-model.mod
Copyright 1999 Stack Overflow AG, All Rights Reserved.
Revision: FML1-model.mod, v1.0.3 1999/10/08 18:06:27
This DTD module is identified by the PUBLIC and SYSTEM identifiers:
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 FML Document Model//EN"
SYSTEM "FML1-model.mod"
Revisions:
....................................................................... -->
<!ENTITY % Table.content "( caption?, ( col* | colgroup* ), (( thead?, tfoot?, tbody+ ) | ( tr | insert )+))">
<!ENTITY % Tbody.content "(( tr | insert )+)">
<!ENTITY % Thead.content "(( tr | insert )+)">
<!ENTITY % Tr.content "(( th | td | insert )+)">
<!ENTITY % Inline.extra
"| textinput | pulldown | listbox | textoutput | textarea
| radio | checkbox | calc | hidden | button | label" >
<!ENTITY % Inlspecial.class "| img | map | applet" >
<!ENTITY % Block.extra "| table | template | insert | toggle | form" >
<!-- end of FML1-model.mod -->
<!-- ...................................................................... -->
<!-- FML 1.0 Form Module ................................................. -->
<!-- file: FML1-form.mod
Copyright 1999 Stack Overflow AG, All Rights Reserved.
Revision: FML1-form.mod, v1.0.5 1999/10/08 18:06:20
This DTD module is identified by the PUBLIC and SYSTEM identifiers:
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 FORM//EN"
SYSTEM "FML1-form.mod"
Revisions:
....................................................................... -->
<!-- %Block-noform.mix; includes all non-form block elements,
plus %Misc.class;
-->
<!ENTITY % Block-noform.mix
"%Heading.class;
| %List.class;
| %Blkstruct.class;
%Blkphras.class;
%Blkpres.class;
| table
%Misc.class;"
>
<!-- Common Form Attributes ............................ -->
<!ENTITY % Form.attrib
"id ID #IMPLIED
class CDATA #IMPLIED
value CDATA #IMPLIED
mandatory CDATA #IMPLIED
send CDATA #IMPLIED"
>
<!ENTITY % FormStyle.attrib
"style CDATA #IMPLIED"
>
<!ENTITY % FormValidation.attrib
"ctype CDATA #IMPLIED
validation CDATA #IMPLIED"
>
<!ENTITY % Formctrl.class
"button |textinput |textarea |radio |checkbox
|pulldown |listbox |hidden |textoutput |calc
|toggle |template |insert |prop"
>
<!ENTITY % Form.content
"(#PCDATA
|%Inline.class;
|%Block-noform.mix;
|%Formctrl.class; )*"
>
<!-- form: Form Element ................................ -->
<!-- form elements should never be nested
-->
<!ELEMENT form %Form.content;
>
<!ATTLIST form
id ID #IMPLIED
action %URI.datatype; #IMPLIED
method ( get | post ) 'post'
enctype %ContentType.datatype; "application/x-www-form-urlencoded"
>
<!ELEMENT button EMPTY
>
<!ATTLIST button
%Form.attrib;
%FormStyle.attrib;
onclick CDATA #IMPLIED
>
<!ELEMENT textinput EMPTY
>
<!ATTLIST textinput
%Form.attrib;
%FormStyle.attrib;
%FormValidation.attrib;
size CDATA #IMPLIED
onchange CDATA #IMPLIED
onblur CDATA #IMPLIED
onfocus CDATA #IMPLIED
>
<!ELEMENT textarea (#PCDATA)
>
<!ATTLIST textarea
%Form.attrib;
%FormStyle.attrib;
%FormValidation.attrib;
rows CDATA #IMPLIED
cols CDATA #IMPLIED
onchange CDATA #IMPLIED
onblur CDATA #IMPLIED
onfocus CDATA #IMPLIED
>
<!ELEMENT hidden EMPTY
>
<!ATTLIST hidden
id ID #IMPLIED
value CDATA #IMPLIED
>
<!ELEMENT textoutput EMPTY
>
<!ATTLIST textoutput
%Form.attrib;
%FormStyle.attrib;
size CDATA #IMPLIED
onclick CDATA #IMPLIED
>
<!ELEMENT radio ( %Inline.mix; | item )*
>
<!ATTLIST radio
%Form.attrib;
>
<!ELEMENT checkbox ( %Inline.mix; | item )*
>
<!ATTLIST checkbox
%Form.attrib;
>
<!ELEMENT item ( #PCDATA | %Inline.mix; )*
>
<!ATTLIST item
%Form.attrib;
%FormStyle.attrib;
type CDATA #IMPLIED
checked CDATA #IMPLIED
onclick CDATA #IMPLIED
>
<!ELEMENT listbox ( option )*
>
<!ATTLIST listbox
%Form.attrib;
%FormStyle.attrib;
rows CDATA #IMPLIED
multiple CDATA #IMPLIED
onchange CDATA #IMPLIED
>
<!ELEMENT pulldown ( option )*
>
<!ATTLIST pulldown
%Form.attrib;
%FormStyle.attrib;
size CDATA #IMPLIED
multiple CDATA #IMPLIED
onchange CDATA #IMPLIED
>
<!ELEMENT option (#PCDATA)
>
<!ATTLIST option
id CDATA #IMPLIED
value CDATA #IMPLIED
selected CDATA #IMPLIED
onclick CDATA #IMPLIED
>
<!ELEMENT label (#PCDATA)
>
<!ATTLIST label
id ID #IMPLIED
for CDATA #IMPLIED
>
<!-- end of FML1-form.mod -->
<!-- ...................................................................... -->
<!-- FML 1.0 Calculation Module .......................................... -->
<!-- file: FML1-calc.mod
Copyright 1999 Stack Overflow AG, All Rights Reserved.
Revision: FML1-calc.mod, v1.0.2 1999/10/08 18:06:11
This DTD module is identified by the PUBLIC and SYSTEM identifiers:
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 CALC//EN"
SYSTEM "FML1-calc.mod"
Revisions:
....................................................................... -->
<!ELEMENT calc ( %Formctrl.class; )
>
<!ATTLIST calc
%Form.attrib;
%FormStyle.attrib;
term CDATA #REQUIRED
digits CDATA #IMPLIED
>
<!-- end of FML1-calc.mod -->
<!-- ...................................................................... -->
<!-- FML 1.0 Toggle Module ............................................... -->
<!-- file: FML1-toggle.mod
Copyright 1999 Stack Overflow AG, All Rights Reserved.
Revision: FML1-toggle.mod, v1.0.2 1999/10/08 18:06:22
This DTD module is identified by the PUBLIC and SYSTEM identifiers:
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 TOGGLE//EN"
SYSTEM "FML1-toggle.mod"
Revisions:
....................................................................... -->
<!ELEMENT toggle ( tg | img | insert | %Formctrl.class; )*
>
<!ATTLIST toggle
id ID #IMPLIED
shared CDATA #IMPLIED
mode CDATA #IMPLIED
send CDATA #IMPLIED
>
<!ELEMENT tg ( #PCDATA | %Flow.mix; )*
>
<!ATTLIST tg
id ID #IMPLIED
onhide CDATA #IMPLIED
onshow CDATA #IMPLIED
style CDATA #IMPLIED
class CDATA #IMPLIED
>
<!-- end of FML1-toggle.mod -->
<!-- ...................................................................... -->
<!-- FML 1.0 Image Module ............................................. -->
<!-- file: FML1-image.mod
Copyright 1999 Stack Overflow AG, All Rights Reserved.
Revision: FML1-image.mod, v1.0.2 1999/10/07 11:42:46
This DTD module is identified by the PUBLIC and SYSTEM identifiers:
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 IMAGE//EN"
SYSTEM "FML1-image.mod"
Revisions:
....................................................................... -->
<!ENTITY % ImgAlign.attrval "(left|right|center)" >
<!ENTITY % Img.content "EMPTY" >
<!ELEMENT img %Img.content; >
<!ATTLIST img
%Common.attrib;
src %URI.datatype; #REQUIRED
alt %Text.datatype; #REQUIRED
height %Length.datatype; #IMPLIED
width %Length.datatype; #IMPLIED
align %ImgAlign.attrval; #IMPLIED
preload CDATA #IMPLIED
>
<!-- end of FML1-image.mod -->
<!-- ...................................................................... -->
<!-- FML 1.0 Template Module ............................................. -->
<!-- file: FML1-template.mod
Copyright 1999 Stack Overflow AG, All Rights Reserved.
Revision: FML1-template.mod, v1.0.2 1999/10/07 11:42:31
This DTD module is identified by the PUBLIC and SYSTEM identifiers:
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 TEMPLATE//EN"
SYSTEM "FML1-template.mod"
Revisions:
....................................................................... -->
<!ENTITY % Template.content
"( #PCDATA | tr | td | tg
| %Inline.class; | %Block.mix; )*"
>
<!ELEMENT template %Template.content; >
<!ATTLIST template
name CDATA #IMPLIED
id ID #REQUIRED
>
<!ELEMENT insert (prop*)>
<!ATTLIST insert
name CDATA #IMPLIED
id ID #REQUIRED
template CDATA #REQUIRED
>
<!ELEMENT prop (#PCDATA)>
<!ATTLIST prop
id ID #IMPLIED
name CDATA #IMPLIED
>
<!-- end of FML1-template.mod -->
<!-- ....................................................................... -->
<!-- XHTML-FML 1.0 DTD .................................................... -->
<!-- file: xhtml-fml1.dtd
-->
<!-- XHTML Forms Markup Language (XHTML-FML) 1.0
This is XHTML-FML 1.0, a modularization-based extended subset of XHTML 1.1.
Copyright 1998-1999 Stack Overflow AG, Munich.
Permission to use, copy, modify and distribute the XHTML-FML 1.0 DTD and
its accompanying documentation for any purpose and without fee is
hereby granted in perpetuity, provided that the above copyright notice
and this paragraph appear in all copies. The copyright holders make
no representation about the suitability of the DTD for any purpose.
It is provided "as is" without expressed or implied warranty.
Authors: Malte Wedel <malte@overflow.de>
Sebastian Schnitzenbaumer <schnitz@overflow.de>
Murray M. Altheim <altheim@eng.sun.com>
-->
<!-- This is the driver file for version 1.0 of the XHTML-FML DTD.
Please use this formal public identifier to identify it:
"-//OVERFLOW//DTD XHTML-FML 1.0//EN"
Please use this URI to identify the default namespace:
"http://www.w3.org/TR/xhtml1"
Please use this URI to identify the FML namespace in XHTML-FML:
"http://www.mozquito.org/xhtml-fml1"
For example, if you are using XHTML-FML 1.0 directly, use the FPI
in the DOCTYPE declaration, with the xmlns attributes on the
document element to identify the namespaces:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//OVERFLOW//DTD XHTML-FML 1.0//EN"
"http://www.mozquito.org/dtd/xhtml-fml1.dtd" >
<html xmlns="http://www.w3.org/TR/xhtml1"
xmlns:x="http://www.mozquito.org/xhtml-fml1"
xml:lang="en" >
...
</html>
Revisions:
(none)
-->
<!ENTITY % XHTML.ns "http://www.w3.org/TR/xhtml1" >
<!ENTITY % HTML.version "" >
<!ENTITY % xhtml-applet.module "IGNORE" >
<!ENTITY % xhtml-script.module "IGNORE" >
<!ENTITY % xhtml-object.module "IGNORE" >
<!ENTITY % xhtml-image.module "IGNORE" >
<!ENTITY % xhtml-form.module "IGNORE" >
<!ENTITY % FML1-model.mod
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 MODEL//EN"
"FML1-model.mod" >
%FML1-model.mod;
<!ENTITY % XHTML1-transitional
PUBLIC "-//W3C//XHTML 1.0 Transitional//EN"
"xhtml1-t.dtd" >
%XHTML1-transitional;
<!ENTITY % FML1-form.mod
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 FORM//EN"
"FML1-form.mod" >
%FML1-form.mod;
<!ENTITY % FML1-calc.mod
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 CALC//EN"
"FML1-calc.mod" >
%FML1-calc.mod;
<!ENTITY % FML1-template.mod
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 TEMPLATE//EN"
"FML1-template.mod" >
%FML1-template.mod;
<!ENTITY % FML1-toggle.mod
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 TOGGLE//EN"
"FML1-toggle.mod" >
%FML1-toggle.mod;
<!ENTITY % FML1-image.mod
PUBLIC "-//OVERFLOW//ELEMENTS FML 1.0 IMG//EN"
"FML1-image.mod" >
%FML1-image.mod;
<!-- end of XHTML-FML 1.0 DTD ............................................ -->
<!-- ...................................................................... -->
(link)
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//OVERFLOW//DTD XHTML-FML 0.8//EN"
"http://www.mozquito.org/dtd/xhtml-fml08.dtd">
<html xmlns="http://www.mozquito.org/xhtml-fml08">
<head>
<title>Order Form</title>
</head>
<body>
<template id="order_product">
<textoutput id="product" value="product |name|" />
<textoutput id="price_|name|" value="|price|" />
<pulldown id="amount_|name|">
<option id="0" value="1">one</option>
<option id="1" value="2">two</option>
<option id="2" value="3">three</option>
<option id="3" value="4">four</option>
<option id="4" value="5">five</option>
</pulldown>
<calc term="price_|name| * amount_|name|">
<textoutput id="sum" size="10" />
</calc>
</template>
<form id="shop">
name:
<textinput id="name" mandatory="yes" size="20" />
adress:
<textinput id="adress" mandatory="no" size="20" />
e-mail:
<textinput id="email" ctype="email" validation="strict" mandatory="yes" size="20" />
payment method:
<radio id="payment">
<item id="credit" value="credit" onclick="toggle:payinp,1;">credit card</item>
<item id="credit" value="transact" onclick="toggle:payinp,2;">transaction</item>
</radio>
<toggle id="payinp">
<tg id="0">
card number:
<textinput id="cardnum" ctype="creditcard" size="16" />
valid until:
<textinput id="valid" ctype="sdate" size="5" />
</tg>
<tg id="1">
account:
<textinput id="account" ctype="bankaccount" size="16" />
bank:
<textinput id="bank" size="20" />
</tg>
</toggle>
your order:
<insert template="order_product">
<prop name="name">one</prop>
<prop name="price">9.99</prop>
</insert>
<insert template="order_product">
<prop name="name">two</prop>
<prop name="price">12.99</prop>
</insert>
</form>
</body>
</html>
