Spring WebFlow2 Javascript只能在第一个单选按钮上工作

时间:2012-09-05 17:20:41

标签: java javascript spring spring-mvc spring-webflow

Spring WebFlow2 Javascript仅适用于第一个单选按钮

如果用户点击其中一个单选按钮,我正在尝试使用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>

1 个答案:

答案 0 :(得分:1)

你有:

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

您的两个单选按钮具有相同的元素ID。 AjaxEventDecoration基于该elementId进行查找。它假设它在页面上是唯一的,并且它不期望具有相同id的多个元素。你应该给第二个radiobutton另一个id。

您可能只需重新输入该ID的AjaxEventDecoration。 如果Spring.AjaxEventDecoration允许你基于元素类(而不是elementId)做类似的事情,也许你可以这样做,而不是复制当前的Spring.AjaxEventDecoration片段。