如何在查看頁面上顯示服務器端驗證錯誤

Question

因爲我正在使用grails框架，但沒有使用controller.My應用程序是「單頁應用程序」。我不想重新加載我的頁面，所以我寫了服務，即RegistrationService用Ajax調用。所以我使用knockout進行數據綁定。使用的數據庫是postgresql。 我有一個查看頁面，我有一個電子郵件字段。當我輸入一個重複的電子郵件ID並點擊保存按鈕，然後我可以看到一個驗證錯誤，即「電子郵件已被採取」，但即使我正在寫一個唯一的ID，那麼我也得到了相同的驗證錯誤。是因爲它在modalModal.js頁面出現錯誤情況，所以我沒有得到如何解決這個問題。我只想當我輸入唯一的ID，然後單擊保存按鈕，那麼它不應該給出驗證錯誤。

_newCostingpage.gsp (my view page) 

    <div id="light" class="white_content" style="color: black;"> 
    <form action="#/cart" method="post"> 
    <input type="hidden" name="url" value="${grailsApplication.config.serverURL}"/> 
    <p><label>first name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input name="firstName" 
      class="formElement" data-bind='value: firstName'/></label></p> 
    <p><label>last name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input name="lastName" 
       class="formElement" data-bind='value: lastName' /></label></p> 
    <p><label>organisation: <input name="organisation" class="formElement" data- 
       bind='value: organisation' /></label></p> 
<p><label>email:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
     <input name="email" class="formElement" data-bind='value: email' /></label><label 
     id="errorDiv"></label></p> 
<p><label>password:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="password" name="password" 
     class="formElement" data-bind='value: password' /></label></p> 
<p><label style="margin-left: -37px;">confirm password:</label> <input 
     type="password" name="confirmPassword" class="formElement" data-bind='value: 
     confirmPassword' /></p> 
<p><input type="submit" value="register"/></p> 
</form> 
<a href="javascript:void(0)"onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none';clearBox();">Close</a> 
     </div> 
     <div id="fade" class="black_overlay"></div> 
    </div> 

Domain class :-\ 

    class Registration { 
String firstName 
String lastName 
String organization 
String email 
String password 
String confirmPassword 

static constraints = { 
    firstName(nullable:false) 
    lastName(nullable:true) 
    organization(blank:false) 
    email(nullable:false,email:true,unique:true) 
    password(blank:false) 
    confirmPassword(blank:false) 
       } 
      } 

modalModal.js

var ratPack = $.sammy(function() { 
this.post('#/cart', function() { 
    var firstname = this.params['firstName']; 
    var lastName = this.params['lastName']; 
    var organisation = this.params['organisation']; 
    var email = this.params['email']; 
    var password = this.params['password']; 
    var confirmPassword = this.params['confirmPassword']; 
    var baseurl = this.params['url']; 
    $.ajax({ 
     type : 'POST', 
     url :'http://localhost:9191/guido-rest- 
          resource/api/registration/'+firstname+'/'+lastName+'/'+email, 
     success : function() { 
      alert("success:"); 
     }, 
     error:function(){ 
      $('#errorDiv').text("Email has already been taken"); 
     } 
    }); 
    }); 
     }); 
     $(function() { 
     ratPack.run(); 
     }); 
     function clearBox(){ 
     $('.formElement').val(""); 
     } 


    RegistrationResource.groovy 

     package common.rest.resourcepl 
     import static org.grails.jaxrs.response.Responses.* 
     import javax.ws.rs.Consumes 
     import javax.ws.rs.GET 
     import javax.ws.rs.Produces 
     import javax.ws.rs.Path 
     import javax.ws.rs.PathParam 
     import javax.ws.rs.POST 
     import javax.ws.rs.core.Response 
     import common.servicepl.RegistrationService 
    @Path('/api/registration') 
     class RegistrationResource { 
    @GET 
    @Produces('text/plain') 
    String getRegistrationRepresentation() { 
    'Registration' 
    } 
    def registrationService; 
    @POST 
    @Path('/{firstname}/{lastName}/{email}') 
    Response create(@PathParam('firstname') String firstname, 
       @PathParam('lastName') String lastName, 
       @PathParam('email') String email) { 
       return 
     RegistrationService().createRegistration(firstname,lastName,email); 
    } 
    } 

    RegistrationService.groovy 

     package common.servicepl 
     import common.persistencepl.Registration 
     class RegistrationService { 
       def createRegistration(String firstName,String lastName,String email) { 
     println "Inside Registration Service" 
     def reg = new Registration(); 
     reg.firstName = firstName; 
     reg.lastName = lastName; 
     reg.password = "asdf"; 
     reg.confirmPassword = "asdf"; 
     reg.email = email; 
     reg.organization = "fasdf"; 
     if(reg.save([flush:true])){ 
      return true 
     } 
     else 
     { 
      return false 
     } 
      } 
     } 

Answer 1

服務器應該在響應服務器端錯誤。

使這些錯誤消息成爲viewmodal的一個屬性，並將其綁定到正確樣式的html段。

此外，當您從同一個應用程序調用服務，不speficy的完整路徑類似http://localhost...，指定它相對於當前的頁面/api/registration...

Answer 2

Grails的控制器，你應該寫：

if (!beanName.hasErrors() && beanName.validate()) { 
     // TODO 
    } else { 
     render status: Constants.SC_VALIDATION_FAILED, view: "viewName", model: [beanName: beanName] 
} 

，並考慮：

<div> 
<g:hasErrors bean="${beanName}"> 
    <div class="errors"> 
    <g:renderErrors bean="${beanName}" as="list"/> 
    </div> 
</g:hasErrors> 
</div>