В этой статье мы покажем, как решать важнейшие задачи, используя всего лишь небольшое количество основных XForms-тегов. Мы рассмотрим использование и синтаксис этих тегов, а также смысл некоторых обычных атрибутов. Объяснение отдельных тегов будет сопровождаться ссылками на к статье, где приведена вся спецификация.
Для первого знакомства со структурой формы и синтаксисом XForms рассмотрим всем хорошо известный пример "Hello World". Этот пример позволяет сравнить XForms с другими языками разметки. В следующих разделах будут показаны части формы, предназначенной для выполнения заказа в среде электронной коммерции; эта форма будет рассматриваться на протяжении всей статьи.
В Листинге 2 приведен весь код "Hello World", показано, как может выглядеть этот пример при его отображении в окне браузера, совместимого с XForms. Обратите внимание на основную структуру этого документа, поскольку каждый XForms-документ имеет схожую разметку. Вы увидите, что модель определяется в пределах заголовка (см. XForms-модель), а представление в теле документа (см. Пользовательский интерфейс XForms). Заметьте, что пространства имен указываются в пределах каждого HTML-тега. Для того, чтобы избежать конфликта имен, необходимо, где только можно, использовать префиксы пространств имен.
Листинг 2. Hello World <!--Hello World Example--> Обратите внимание на то, что поскольку в настоящий момент язык XForms не располагает процессором в виде готового продукта, изображения всех примеров - это всего лишь иллюстрации, которые не являются результатом реализации XForms. (Ссылки на бета-версии XForms- процессоров см. в Ресурсах.)
<html xmlns= "http://www.w3.org/1999/xhtml"
xmlns:xforms="http://www.w3.org/2002/01/xforms"
xmlns:my="http://www.example.com/my-data">
<head>
<!--The Model is defined within the head of the xhtml document-->
<xforms:model> <!--The instance is defined within the model-->
<xforms:instance>
<my:data>Hello World</my:data>
</xforms:instance>
</xforms:model>
</head>
<body> <!--The view is defined within the body of the document-->
<xforms:group>
<xforms:output ref="/my:data">
<xforms:label>Output Control Example</xforms:label>
</xforms:output>
</xforms:group>
</body>
</html>
В остальной части статьи рассказывается о форме, используемой для выполнения заказа в среде электронной коммерции. Эта форма заказа состоит из разделов, предназначенных для ввода информации о клиенте, подсчета цены и перечисления приобретенных товаров. Сначала мы рассмотрим определение модели, а затем описание представления. В приводится полный текст кода, показано изображение этой формы заказа.
Навигация