2014-09-19 105 views
0

我有形式代码插入到数据库两次

<aui:form action="<%= editURL %>" method="POST" name="fm"> 
    <aui:fieldset> 

     <aui:input name="name" /> 

     <aui:input name="url" /> 

     <aui:input name="address" /> 

    </aui:fieldset> 

    <aui:button-row> 
     <aui:button type="submit" /> 

     <aui:button name="cancel" value="Cancel"/> 

    </aui:button-row> 
</aui:form> 

和这片被插入到数据库两次,我不知道为什么javascript代码。

<aui:script use="aui-base,aui-form-validator,aui-io-request"> 
    AUI().use('aui-base','aui-form-validator',function(A){ 
     var rules = { 
      <portlet:namespace/>name: { 
       required: true 
      }, 

      <portlet:namespace/>url: { 
       url: true 
      }, 

      <portlet:namespace/>address: { 
       required: true 
      }, 
     }; 

     var fieldStrings = { 
      <portlet:namespace/>name: { 
       required: 'The Name field is required.' 
      }, 

      <portlet:namespace/>address: { 
       required: 'The Address field is required.' 
      }, 
     }; 
     alert("validator"); 
     new A.FormValidator({ 
      boundingBox: '#<portlet:namespace/>fm', 
      fieldStrings: fieldStrings, 
      rules: rules, 
      showAllMessages:true, 
      on: { 
        validateField: function(event) { 
        }, 
        validField: function(event) { 
        }, 
        errorField: function(event) { 
        }, 
        submitError: function(event) { 
         alert("submitError"); 
         event.preventDefault(); //prevent form submit 
        }, 
        submit: function(event) { 
         alert("Submit"); 

         var A = AUI(); 
         var url = '<%=editURL.toString()%>'; 

         A.io.request(
          url, 
          { 
           method: 'POST', 
           form: {id: '<portlet:namespace/>fm'}, 
           on: { 
            success: function() { 
             alert("inside success");// not getting this alert. 
             Liferay.Util.getOpener().refreshPortlet(); 
             Liferay.Util.getOpener().closePopup('popupId');          
            } 
           } 
          } 
         ); 
        } 
       } 
     }); 
    }); 

</aui:script> 

但是如果我添加以下代码段,这是多余的,因为它是上面的代码submit block内已经存在,并且不触发任何方式,因为我没有表单中任何save按钮,然后该值仅插入一次。

<aui:script use="aui-base,aui-io-request"> 
    A.one('#<portlet:namespace/>save').on('click', function(event) { 
     var A = AUI(); 
     var url = '<%=editURL.toString()%>'; 

     A.io.request(
      url, 
      { 
       method: 'POST', 
       form: {id: '<portlet:namespace/>fm'}, 
       on: { 
        success: function() { 
         Liferay.Util.getOpener().refreshPortlet(); 
         Liferay.Util.getOpener().closePopup('popupId'); 
        } 
       } 
      } 
     ); 

    }); 
</aui:script> 

此代码生成Uncaught TypeError: Cannot read property 'on' of null我认为这是因为在形式没有save按钮。但是添加这个代码,这个值只是插入到数据库中,这是我想要的,但逻辑是有缺陷的。我怎么才能通过使用第一段代码来获得我想要的结果?

+2

鉴于您在使用IO请求时会得到双重输入,请考虑放置位置。您已经在侦听器中的一个URL上调用了一个IO,该侦听器正在处理针对相同URL的表单提交。不过,我希望在这种情况下能够触发成功警报。要么阻止默认提交或删除IO。 – Origineil 2014-09-21 03:44:12

回答

0

插入发生两次。一旦从default form submit和其他从A.io.request。添加这段代码

<aui:script use="aui-base,aui-io-request"> 
    A.one('#<portlet:namespace/>save').on('click', function(event) { 
     var A = AUI(); 
     var url = '<%=editURL.toString()%>'; 

     A.io.request(
      url, 
      { 
       method: 'POST', 
       form: {id: '<portlet:namespace/>fm'}, 
       on: { 
        success: function() { 
         Liferay.Util.getOpener().refreshPortlet(); 
         Liferay.Util.getOpener().closePopup('popupId'); 
        } 
       } 
      } 
     ); 

    }); 
</aui:script> 

导致只插入一次。此代码显然没有相关性,因为表单中没有save按钮。因此,有Uncaught TypeError: Cannot read property 'on' of null掩盖了这个缺陷,并阻止了表单被提交两次。

删除上述代码并阻止默认提交(通过在表单标记中添加onSubmit="event.preventDefault();)可以解决此问题。