Xforms с javascript - определить, если флажок установлен или не установлен
Я разрабатываю форму с использованием betterFORMS, которая позволяет пользователю проверить, какие поля применяются к ним, а затем отправить данные для обработки. Форма заполнена и работает - я просто хотел добавить некоторую проверку формы, которая останавливает пользователя, отправляющего запрос, если ни один из флажков не установлен.
Модель и пространства имен:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0"
xmlns="http://www.w3.org/2002/06/xhtml2" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xforms="http://www.w3.org/2002/xforms" xmlns:xsd="http://www.w3.org/2001/XMLSchema"
<xsl:output method="xml" />
<xsl:template match="/">
<xforms:model id="documentsChecklist">
<xforms:instance>
<actionform xmlns="">
<xforms:model id="documentsChecklist">
<xforms:instance>
<actionform xmlns="">
<detail>
<other></other>
<otherText></otherText>
</detail>
</actionform>
</xforms:instance>
<xforms:bind id="other" nodeset="/actionform/detail/other" calculate="choose(. = 'Y', ., 'N')"/>
<xforms:bind nodeset="/actionform/detail/otherBox" relevant="/actionform/detail/other ='Y'" />
</xforms:model>
Моя форма:
<div id="formBody"><br />
<xforms:select bind="other" appearance="full" align="right">
<xforms:item>
<xforms:label>Other</xforms:label>
<xforms:value>Y</xforms:value>
</xforms:item>
</xforms:select>
<xforms:input ref="/actionform/detail/otherText">
<xforms:label>Please specify:*</xforms:label>
</xforms:input>
<xforms:submit submission="formSubmit" id="send" class="ui-button" onclick="checkForm(this);return false;">
<xforms:label>Send</xforms:label>
</xforms:submit>
</div>
<xforms:submit submission="formSubmit" id="maskButton" class="ui-button">
<xsl:attribute name="style">display:none</xsl:attribute>
</xforms:submit>
<script type="text/javascript">
function checkForm(){
var otherCheckValue = document.getElementById('otherCheck-value');
alert(otherCheckValue.value);
if(boxesChecked != 0){
document.getElementById('maskButton-value').click();
}
}
</script>
</xsl:template>
</xsl:stylesheet>
Идея состоит в том, что кнопка отправки, отображаемая пользователю, вызывает функцию javascript checkForm() и затем отключается.
Функция javascript просматривает каждое из моих текстовых полей и, если хотя бы один из них отмечен, отправляет форму с использованием submit maskButton, которая скрыта от пользователя. В противном случае отобразите предупреждающее сообщение.
Я играл с функцией getElementById(), но, похоже, не могу получить какое-либо значение из моего флажка (отмечен или не отмечен), поэтому я просто пытаюсь отобразить значение в предупреждении. Это предупреждение должно показывать Y для отмеченного или пустого, если оно не изменено или не отмечено (аналогично отправке формы). Но что бы я ни пытался, оповещение пустое.
Другим способом было бы добавить страницу подтверждения после формы, чтобы не все потеряно. Я прошу вас посмотреть, возможно ли то, что я хочу сделать. Спасибо
1 ответ
Без каких-либо инструкций Javascript вы могли бы использовать трюк xforms:group для визуализации элемента управления submit для определенного условия. Что-то вроде этого:
<xforms:group ref=".[detail/other != '']">
<xforms:submit .../>
</xforms:group>
-Alain