2012-09-05 22 views
0

春WebFlow2的Javascript只工作在第一個單選按鈕春WebFlow2的Javascript只工作在第一個單選按鈕

我試圖使用隨WebFlow2提交我的網頁與過渡值春天的JavaScript,如果用戶點擊一個的單選按鈕。

我在頁面上使用onclick和onchange插入了我的javascript,並且只有在選擇了第一個單選按鈕時才起作用。我不知道爲什麼,但我想我嘗試了一切......有人可以告訴我,如果這是一個與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

您有:

<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的多個元素。你應該給第二個單選按鈕另一個ID。

您應該重新輸入該id的AjaxEventDecoration。 如果Spring.AjaxEventDecoration允許你基於元素類(而不是elementId)做類似的事情,也許你可以做到這一點,而不是重複當前的Spring.AjaxEventDecoration片段。