0

Dojo (dijit) を使用して Spring WebFlow プロジェクトで必須のチェックボックスを作成する方法。

下記ページの送信時にチェックボックスを必須にする方法を教えてください。

ユーザーがチェックボックスオプションのいずれかをクリックしなかった場合、送信を機能させたくありません。ありがとう。ユーザーは、ページを送信するために、チェックボックスまたは両方をクリックする必要があります。

 <%@ taglib prefix="c" uri="http://java.sun.com/jstl/core"%>
    <%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt"%>
    <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>



    <style type="text/css" media="screen">
     @import url("<c:url value="/resources/dojo/resources/dojo.css"/>");
     @import url("<c:url value="/resources/dijit/themes/claro/claro.css"/>");
    </style>     

    <script djconfig="parseOnLoad: true"
     src="<c:url value="/resources/dojo/dojo.js"/>" type="text/javascript"></script>
    <script type="text/javascript"
     src="<c:url value="/resources/spring/Spring.js" />"> </script>
    <script type="text/javascript"
     src="<c:url value="/resources/spring/Spring-Dojo.js" />"></script>
    <script type="text/javascript">dojo.require("dojo.parser");</script>

    <html>
    <head>
    <title>Spring 3.0 MVC - Web Flow Example</title>
    </head>
    <body class="claro">
        <h2>CheckBox Test</h2>
        <p>
        <p>
        <form:form commandName="customer" id="customer">
            <input type="hidden" name="_flowExecutionKey"
                value="${flowExecutionKey}" />
            <div id="container">
                <table>
                    <tr>
                        <td><font color=red><form:errors path="sex" /></font><b>Do you have a kid(s) of the follow sex type:</b></td>
                        <td><form:checkbox path="sex" id="sex" value="MALE" /> MALE |  
                            <form:checkbox path="sex" id="sex" value="FEMALE" />FEMALE
                            <script type="text/javascript">
                                dojo.query("#sex input[type='checkbox']").forEach(function(element){
                                    Spring.addDecoration(new Spring.ElementDecoration({
                                        elementId: element.id,
                                        widgetType : "dijit.form.CheckBox",
                                        widgetAttrs : { checked : element.checked, required : true,
                                            validate: function (){
                                                   if(dojo.query("INPUT[type='checkbox']", 'customer').filter(function(n){return n.checked;}).length > 0){return true;} else {alert('choose a type');return false;}
                                              }
    }
                                    }));
                                });
                            </script>
                            </td></tr>
                            </table>
            </div>
            <p>
            <input type="submit" name="_eventId_submit" id="submit" value="Submit" />
            <input type="submit" name="_eventId_cancel" value="Cancel" />
            <p>
            <script type="text/javascript">
                Spring.addDecoration(new Spring.ValidateAllDecoration({
                    elementId : 'submit',
                    event : 'onclick'
                }));
            </script>
        </form:form>
    </body>
    </html>

画面は次のようになります。

ここに画像の説明を入力

4

1 に答える 1

1

動作しました...次のようにjspを変更する必要があります

<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<style type="text/css" media="screen">
 @import url("<c:url value="/resources/dojo/resources/dojo.css"/>");
 @import url("<c:url value="/resources/dijit/themes/claro/claro.css"/>");
</style>     

<script djconfig="parseOnLoad: true"
 src="<c:url value="/resources/dojo/dojo.js"/>" type="text/javascript"></script>
<script type="text/javascript"
 src="<c:url value="/resources/spring/Spring.js" />"> </script>
<script type="text/javascript"
 src="<c:url value="/resources/spring/Spring-Dojo.js" />"></script>
<script type="text/javascript">dojo.require("dojo.parser");</script>

<html>
<head>
<title>Spring 3.0 MVC - Web Flow Example</title>
</head>
<body class="claro">
    <h2>CheckBox Test</h2>
    <p>
    <p>
    <form:form commandName="customer" id="customer">
        <input type="hidden" name="_flowExecutionKey"
            value="${flowExecutionKey}" />
        <div id="container">
            <table>
                <tr>
                    <td><font color=red><form:errors path="sex" /></font><b>Do you have a kid(s) of the follow sex type:</b></td>
                    <td><form:checkbox path="sex" id="MALE" value="MALE" /> MALE |
                        <script type="text/javascript">
                                            Spring.addDecoration(new Spring.ElementDecoration(
                                                {
                                                    elementId : 'MALE',
                                                    widgetType : "dijit.form.CheckBox",
                                                    widgetModule : "dijit.form.CheckBox",
                                                    validate: function (){
                                                           if(dojo.query('INPUT[name=sex]', 'customer').filter(function(n){return n.checked;}).length > 0){return true;} else {alert('choose a type');return false;}
                                                      },
                                                    widgetAttrs : {
                                                        value : "MALE",
                                                        required : true,
                                                        promptMessage : "For Retired"
                                                    }
                                                }));
                            </script>  
                        <form:checkbox path="sex" id="FEMALE" value="FEMALE" />FEMALE
                        <script type="text/javascript">
                                            Spring.addDecoration(new Spring.ElementDecoration(
                                                {
                                                    elementId : 'FEMALE',
                                                    widgetType : "dijit.form.CheckBox",
                                                    widgetModule : "dijit.form.CheckBox",
                                                    widgetAttrs : {
                                                        value : "FEMALE",
                                                        required : true,
                                                        promptMessage : "For Retired"
                                                    }
                                                }));
                            </script>
                        </td></tr>
                        </table>
        </div>
        <p>
        <input type="submit" name="_eventId_submit" id="submit" value="Submit" />
        <input type="submit" name="_eventId_cancel" value="Cancel" />
        <p>
        <script type="text/javascript">
            Spring.addDecoration(new Spring.ValidateAllDecoration({
                elementId : 'submit',
                event : 'onclick'
            }));
        </script>
    </form:form>
</body>
</html>
于 2012-10-15T18:02:01.447 に答える