2014-01-10 2 views
0

betterFORMS를 사용하여 양식을 개발하고있어 사용자가 어떤 필드를 적용했는지 확인한 후 처리를 위해 데이터를 보낼 수 있습니다. 양식이 완성되어 작동 중입니다. 확인란을 선택하지 않으면 사용자가 요청을 보내는 것을 막는 양식 유효성 검사를 추가하기 만했습니다.XForms with javascript - 확인란이 선택되어 있는지 확인하지 않았는지 확인하십시오.

모델 및 네임 스페이스 :

<?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> 

아이디어는 사용자에게 표시 제출 버튼이 자바 스크립트 함수의 checkForm()를 호출하고 있다는 것이다 사용할 수 없습니다.

javascript 함수는 각 텍스트 상자를 살펴보고 적어도 하나라도 선택되어 있으면 사용자에게 숨겨진 submission을 사용하여 양식을 보냅니다. 그렇지 않으면 경고 메시지를 표시하십시오.

나는 getElementById() 함수를 가지고 놀았지만 내 체크 박스 (체크되거나 체크되지 않음)에서 어떤 값도 얻지 못하는 것 같아서, 그래서 나는 단지 값을 경고로 표시하려고 노력하고있다. 이 알림에는 변경되지 않았거나 선택 취소 된 경우 체크 된 또는 비어있는 경우 Y가 표시되어야합니다 (양식 제출과 동일). 그러나 내가 무엇을 시도했는지에 상관없이 경고는 비어 있습니다.

또 다른 방법은 양식 다음에 확인 페이지를 추가하는 것이므로 모두 손실되지 않습니다. 나는 내가하고 싶은 일이 가능한지 보도록 요청하고 있습니다. 감사합니다

+0

는 당신이 원하는 http://stackoverflow.com/questions/11440128/jquery-check-if-checkbox-is-not-checked/11440171#11440171 각 체크 박스 안의 "checked"속성을 찾으십시오. 경고를 otherCheckValue.checked로 변경하십시오. 점검 여부에 따라 참 또는 거짓이어야합니다. –

+0

.value 대신 checked 속성을 사용했지만 항상 false를 표시했습니다. –

답변

1

자바 스크립트 명령어가 없으면 xforms : group 트릭을 사용하여 특정 조건에 대한 제출 제어를 렌더링 할 수 있습니다. 이런 식으로 뭔가 :

<xforms:group ref=".[detail/other != '']"> 
    <xforms:submit .../> 
</xforms:group> 

-Alain

+0

작동하는 것처럼 들리지만 여러 상자를 확인해야합니다. 심판에 하나 이상의 xpath가있을 수 있습니까? 아니면 각각에 대해 그룹을 만들어야합니까? 감사합니다 –

+1

@ a.hrdie : 대괄호 사이의 부분은 중괄호, ands 및 ors로 그룹화 할 수있는 부울 표현식입니다. 'ref = "와 같은 것을 할 수 있습니다. [detail/other! = ''&& detail/otherCheck-value! = '']" – grtjn

+1

@ a.hrdie : woops, 오타를 만들었습니다. 그것은 XPath에서'&&'가 아니라'and'입니다. 동정 내 의견을 수정할 수 없습니다 .. – grtjn

관련 문제