0

Spring WebFlow2 Javascript は最初のラジオ ボタンでのみ動作します

ユーザーがラジオ ボタンの 1 つをクリックすると、WebFlow2 に付属する Spring JavaScript を使用して、ページにトランジション値を送信しようとしています。

onclick と onchange を使用してページに JavaScript を挿入しましたが、最初のラジオ ボタンが選択されている場合にのみ機能します。理由はわかりませんが、すべてを試したと思います...これがSpring JavaScriptの問題であるかどうか教えてください。

JSP:

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<head>
<title>Spring 3.0 MVC - Web Flow Example</title>

<script type="text/javascript"
    src="<c:url value="/resources/dojo/dojo.js" />">

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

<link type="text/css" rel="stylesheet"
    href="<c:url value="/resources/dijit/themes/tundra/tundra.css" />" />
</head>
<body>
    <h2>Customer Registration</h2>

    <form:form commandName="customer" id="customer">
        <input type="hidden" name="_flowExecutionKey"
            value="${flowExecutionKey}" />
        <table>
            <tr>
                <td><font color=red><form:errors path="name" /></font><b>Name:
                </b></td>
                <td><form:input path="name" id="name" /> <script
                        type="text/javascript">
                    Spring
                            .addDecoration(new Spring.ElementDecoration(
                                    {
                                        elementId : "name",
                                        widgetType : "dijit.form.ValidationTextBox",
                                        widgetAttrs : {
                                            promptMessage : "This is the name you would like entered into the system."
                                        }
                                    }));
                </script> <br />
                    <p></td>
            </tr>
            <tr>
                <td><font color=red><form:errors path="phoneNumber" /></font>

                    <b>Phone number: </b></td>
                <td><form:input path="phoneNumber" id="phoneNumber" /><br />
                    <script type="text/javascript">
                        Spring
                                .addDecoration(new Spring.ElementDecoration(
                                        {
                                            elementId : "phoneNumber",
                                            widgetType : "dijit.form.ValidationTextBox",
                                            widgetAttrs : {
                                                promptMessage : "This is the phone number for the above name"
                                            }
                                        }));
                    </script></td>
            </tr>
            <tr>
                <td></td>
            </tr>
            <tr>
                <td><b>Row:</b></td>
                <td><form:radiobutton value="B" path="row" id="rowBtn" />Row: B<BR>
                    <form:radiobutton value="A" path="row" id="rowBtn" />Row: A<BR>
                    <script type="text/javascript">
            Spring.addDecoration(new Spring.AjaxEventDecoration({
                elementId: "rowBtn",
                event: "onchange",
                formId:"customer",
                params: {fragments:"body", _eventId: "proceed"}
            }));
        </script>

        <script type="text/javascript">
            Spring.addDecoration(new Spring.AjaxEventDecoration({
                elementId: "rowBtn",
                event: "onclick",
                formId:"customer",
                params: {fragments:"body", _eventId: "proceed"}
            }));
        </script>

        </td>
            </tr>
            <tr>
            <td>Year of Birth:</td>
            <td>
            <form:select path="byear">
            <form:option value="2012" label="2012" />
            <form:option value="2011" label="2011" />
            <form:option value="2010" label="2010" />
            </form:select>

        <script type="text/javascript">
            Spring.addDecoration(new Spring.AjaxEventDecoration({
                elementId: "byear",
                event: "onchange",
                formId:"customer",
                params: {fragments:"body", _eventId: "proceed"}
            }));
        </script>
        </td></tr>

        </table>
        <input type="submit" name="_eventId_proceed" value="proceed"
            id="proceed" />
            <input type="submit" name="_eventId_cancel" value="Cancel" />
    </form:form>

</body>
</html>
4

1 に答える 1

1

あなたが持っている：

<form:radiobutton value="B" path="row" id="rowBtn" />Row: B<BR>
<form:radiobutton value="A" path="row" id="rowBtn" />Row: A<BR>

2 つのラジオボタンの要素 ID が同じです。AjaxEventDecoration は、その elementId に基づいてルックアップを行います。ページ上で一意であると想定し、同じ ID を持つ複数の要素を想定していません。2 番目のラジオボタンに別の ID を与える必要があります。

おそらく、その ID の AjaxEventDecoration も再入力する必要があります。Spring.AjaxEventDecoration で (elementId の代わりに) 要素クラスに基づいて同様のことを実行できる場合、現在の Spring.AjaxEventDecoration スニペットを複製する代わりに、それを実行できる可能性があります。

于 2012-09-05T18:31:17.563 に答える