Учебное пособие (1075724), страница 36
Текст из файла (страница 36)
5.28. Результат выполнения примера 5.4. Файл «actions.xhtml».350В следующем примере форма содержит фильтр по названию элемента.Пример 5.4. Файл «filter.xhtml».<?xml version="1.0" encoding="UTF-8"?><html xmlns="http://www.w3.org/1999/xhtml"xmlns:xforms="http://www.w3.org/2002/xforms"xmlns:ev="http://www.w3.org/2001/xml-events"xmlns:xsd="http://www.w3.org/2001/XMLSchema"><head><title>Пример фильтра</title><xforms:model><xforms:instance><example xmlns=""><item><text>Пример гиперссылки 1</text><uri>http://iu5.bmstu.ru/1.html</uri></item><item><text>ПРИМЕР гиперссылки 12</text><uri>http://iu5.bmstu.ru/2.html</uri></item><item><text>ПриМер гиперссылки 123</text><uri>http://iu5.bmstu.ru/3.html</uri></item><filter>123</filter></example></xforms:instance><xforms:bind nodeset = "/example/item/uri" type="xsd:anyURI" /></xforms:model></head><body><xforms:group>351<xforms:input ref="filter"><xforms:label>Введите текст фильтра:</xforms:label></xforms:input><!-- Выбираются только те элементы item, элементы text которыхсодержат filter в качестве подстроки.
nodeset="item[contains(text,//filter)]" - фильтр с учетом регистра символов,обычно это нежелательно. Поэтому в примере реализован Фильтр безучета регистра символов. --><xforms:repeat id="repeat1"nodeset="item[contains(translate(text,'абвгдежзийклмнопрстуфхцчшщъьэюя','АБВГДЕЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЬЭЮЯ'),translate(//filter,'абвгдежзийклмнопрстуфхцчшщъьэюя','АБВГДЕЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЬЭЮЯ'))]"><xforms:output value="text"/><xforms:trigger><xforms:label>Перейти</xforms:label><xforms:load ev:event="DOMActivate" show="new"><xforms:resource value="uri"/></xforms:load></xforms:trigger></xforms:repeat></xforms:group></body></html>Результат выполнения примера:352Рис.
5.29. Результат выполнения примера 5.4. Файл «filter.xhtml».5.9 Сохранение данных формыПосле заполнения полей формы, данные должны быть отправлены на сервер.Параметры отправки данных определяются элементом «submission» в моделиданных формы. На элемент «submission» могут ссылаться элементы «submit»(кнопка отправки) и «send» (отправка из обработчика события).С помощью элемента «submission» данные могут быть переданы дляобработки серверному сценарию или сохранены в СУБД «eXist».353Рассмотрим более подробно основные атрибуты элемента «submission».Атрибут «id» определяет id элемента для дальнейших ссылок в форме.Атрибут «action» задает URI серверного сценария, которому будутпередаваться данные.
Считается устаревшим, вместо него должен использоватьсяатрибут «resource».Атрибут «ref=XPath-выражение» определяет, какую часть модели данныхнужно отправлять, по умолчанию «/». Этот атрибут позволяет отправлятьфрагмент модели данных.Атрибут «method» задает метод HTTP-протокола для отправки данных(обычно используется POST, иногда PUT). Метод GET здесь не может бытьиспользован, так как XML-данные не должны передаваться через строку URI.Атрибут «includenamespaceprefixes» позволяет включать в передаваемыеданные нужные префиксы пространств имен. Это полезно в том случае, когдаданные содержат пространства имен.
Пустое значение атрибута указывает, чтопрефиксы пространств имен не передаются на сервер.Атрибут «replace» определяет какую часть XForms-формы нужно заменитьответом, полученным от серверного сценария: «all» (полностью заменить форму),«instance» (заменить только данные формы), «none» (ничего не заменять).В этом разделе для отправки мы будем использовать метод PUT и изучатьотправленные файлы в «eXist». Для доступа к «eXist» через URI (REST-доступ)используетсяследующийURI:«http://localhost:8080/exist/rest/db/названиеколлекции и имя файла.xml».В следующем примере заполненная форма сохраняется в «eXist» с помощьюметодаPUTпротоколаHTTP.ИспользуетсяURI«http://localhost:8080/exist/rest/db/exist_put.xml», то есть данные сохраняются вфайл «exist_put.xml» в корневой коллекции «db».Пример 5.5.
Файл «exist_put.xhtml».<?xml version="1.0" encoding="UTF-8"?><html xmlns="http://www.w3.org/1999/xhtml"xmlns:xforms="http://www.w3.org/2002/xforms"xmlns:ev="http://www.w3.org/2001/xml-events" >354<head><title>Пример сохранения данных с использованием методаput</title><!-- Пустой префикс пространства имен обязателен для корневогоэлемента xforms:instance --><xforms:model><xforms:instance><example xmlns=""><text/><int/><bool/><date/><time/><datetime/></example></xforms:instance><xforms:bind nodeset="bool" type="xforms:boolean"/><xforms:bind nodeset="int" type="xforms:integer"/><xforms:bind nodeset="date" type="xforms:date"/><xforms:bind nodeset="time" type="xforms:time"/><xforms:bind nodeset="datetime" type="xforms:dateTime"/><xforms:submission replace="none"action="http://localhost:8080/exist/rest/db/exist_put.xml"method="put" id="submit_id"/></xforms:model></head><body><xforms:group><xforms:input ref="text"><xforms:label>Введите текст:</xforms:label></xforms:input>355<xforms:input ref="int"><xforms:label>Введите число:</xforms:label></xforms:input><xforms:input ref="bool"><xforms:label>Введите логическое значение:</xforms:label></xforms:input><xforms:input ref="date"><xforms:label>Введите дату:</xforms:label></xforms:input><xforms:input ref="time"><xforms:label>Введите время:</xforms:label></xforms:input><xforms:input ref="datetime"><xforms:label>Введите дату и время:</xforms:label></xforms:input><!-- Кнопка отправки формы.
Атрибут submission ссылается наэлемент xforms:submission в модели --><xforms:submit submission="submit_id"><xforms:label>Отправка формы</xforms:label></xforms:submit></xforms:group></body></html>Результат выполнения примера:356Рис. 5.30. Результат выполнения примера 5.5. Файл «exist_put.xhtml».Рис. 5.31. Результат выполнения примера 5.5. Файл «exist_put.xml».В следующем примере используются пространства имен.Пример 5.5.
Файл «exist_ns.xhtml».<?xml version="1.0" encoding="UTF-8"?>357<html xmlns="http://www.w3.org/1999/xhtml"xmlns:iu5="http://iu5.bmstu.ru"xmlns:xforms="http://www.w3.org/2002/xforms"xmlns:ev="http://www.w3.org/2001/xml-events" ><head><title>Пример сохранения данных с использованием пространстваимен</title><xforms:model><xforms:instance><iu5:example><iu5:text/><iu5:int/><iu5:bool/><iu5:time/><iu5:datetime/><!-- Пример вложенного элемента --><iu5:container1><iu5:container2><iu5:date/></iu5:container2></iu5:container1></iu5:example></xforms:instance><xforms:bind nodeset="iu5:bool" type="xforms:boolean"/><xforms:bind nodeset="iu5:int" type="xforms:integer"/><xforms:bind nodeset="iu5:container1/iu5:container2/iu5:date"type="xforms:date"/><xforms:bind nodeset="iu5:time" type="xforms:time"/><xforms:bind nodeset="iu5:datetime" type="xforms:dateTime"/><xforms:submission replace="none"action="http://localhost:8080/exist/rest/db/exist_ns.xml"method="put" id="submit_id" includenamespaceprefixes="iu5" /></xforms:model></head>358<body><xforms:group><xforms:input ref="iu5:text"><xforms:label>Введите текст:</xforms:label></xforms:input><xforms:input ref="iu5:int"><xforms:label>Введите число:</xforms:label></xforms:input><xforms:input ref="iu5:bool"><xforms:label>Введите логическое значение:</xforms:label></xforms:input><xforms:input ref="iu5:container1/iu5:container2/iu5:date"><xforms:label>Введите дату:</xforms:label></xforms:input><xforms:input ref="iu5:time"><xforms:label>Введите время:</xforms:label></xforms:input><xforms:input ref="iu5:datetime"><xforms:label>Введите дату и время:</xforms:label></xforms:input><!-- Кнопка отправки формы.
Атрибут submission ссылается наэлемент xforms:submission в модели --><xforms:submit submission="submit_id"><xforms:label>Отправка формы</xforms:label></xforms:submit></xforms:group></body>359</html>Результат выполнения примера:Рис. 5.32. Результат выполнения примера 5.5. Файл «exist_ns.xhtml».Рис. 5.33. Результат выполнения примера 5.5. Файл «exist_ns.xml».360Более сложные примеры совместного использования XForms-форм и СУБД«eXist» будут рассмотрены в разделе XRX-приложений.5.10 Использование таблиц стилей CSS в XForms-формахПри разработке форм XForms часто возникает необходимость изменитьвнешний вид элементов управления формы с помощью стилей CSS.Особенностью является то, что XForms-процессоры преобразуют XHTMLдокумент (содержащий XForms-форму) в HTML-документ (обычно содержащийJavaScript и собственные стили CSS), поэтому не всегда понятно, к чему же нужноприменять CSS-стиль.Как правило, в каждом XForms-процессоре существует собственный способприменения стилей.
Наиболее распространенными являются два способа:1. Стили применяются к XForms-форме в исходном XHTML-документе.XForms-процессор учитывает эти стили при преобразовании формы в HTML.2. Стили применяются к результирующему HTML-документу.5.10.1 Применение стилей CSS к XForms-формеВ 1 способе CSS-стили применяются к XForms-элементам. Этот способявляется рекомендуемым и в черновом варианте описан в стандарте XForms (вдальнейшем предполагается сделать это отдельным стандартом).Но пока это черновая рекомендация, и ее только начинают поддерживатьнекоторые XForms-процессоры. В частности, этот способ используется вXSLTForms, и мы в дальнейшем будем применять его в XRX-приложениях.Пример:/* Объявление пространства имен xforms */@namespace xf url('http://www.w3.org/2002/xforms');/* Определение стиля для элемента input с псевдоклассом read-only */xf|input { display: inline; }В спецификации также определены дополнительные псевдоклассы ипсевдоэлементы, предназначенные для работы с XForms, например псевдоклассы361«:read-only» для обозначения элементов только для чтения и «:read-write» дляостальных элементов.5.10.2 ПрименениестилейCSSкрезультирующемуHTML-документуВо 2 способе стили должны применяться к результирующему HTMLдокументу.Но как узнать соответствие между исходными XForms-элементами иполученными после преобразования HTML-элементами?ВразличныхXForms-процессорахэтазадача решаетсяпо-разному.Например, betterFORM добавляет при преобразовании специальные CSS-классы,которые «похожи» по названию на исходные XForms-элементы.
![](https://s.studizba.com/z.php?f=/templates/si/i/noavatar.png&w=100&h=100&t=1"){kind=avatar}
