Controller reagiert auf AJAX-Anfrage mit der gesamten Ansicht

Question

Ich habe ein Login-Formular (in index.jsp), die von jQuery POST-Funktion zu meinem Controller übermittelt wird. Nach dem Klicken auf die Schaltfläche "Senden" wird die gesamte Ansicht in mein Fehlermeldungselement geladen - und nicht der Benutzername, der in die Formulareingabe eingegeben wurde.

Irgendwelche Ideen, wo ich falsch liege? Jede Hilfe würde sehr geschätzt werden.

Login-Formular

<form class="form-inline" id="loginForm" role="form" style="margin-top: 20px"> 
    <div class="form-group"> 
     <input type="text" name="username" class="form-control" id="username" placeholder="Enter your username" 
      autocomplete="off" autocapitalize="off"> 
    </div> 
    <div class="form-group"> 
     <input type="password" name="password" class="form-control" id="password" placeholder="Enter your password" 
      autocomplete="off" autocapitalize="off"> 
    </div> 
    <div class="form-group"> 
     <button type="submit" name="loginBtn" class="btn btn-default" id="loginBtn">Log in</button> 
    </div> 
     <label class="formErrorMsg" id="loginErrorMsg" for="loginBtn"></label> 
</form> 

login.js

$(document).ready(function(){ 
    // Check that the login credentials entered are valid 
    $("#loginBtn").click(function(){ 
     event.preventDefault(); 
     $.post("/login", {username : $("#username").val()}, function(result){ 
      $("#loginErrorMsg").html(result) 
     }); 
    }); 
}); 

Indexcontroller

@Controller 
public class IndexController { 
    // Map requests for "/" to index.jsp 
    @RequestMapping(value = "/") 
    public ModelAndView returnIndexPage() { 
     ModelAndView model = new ModelAndView("index"); 
     return model; 
    } 
    // Map AJAX request, via login form, to login 
    @RequestMapping(value = "/login", method = RequestMethod.POST) 
    @ResponseBody 
    public String checkLoginCredentials(@RequestParam("username") String username){ 
     return username; 
    } 
} 

feder Dispatcher-servlet.xml

<mvc:annotation-driven/> 

<mvc:resources mapping="/webjars/**" location="/webjars/"/> 
<mvc:resources mapping="/resources/**" location="/resources/" /> 

<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver"> 
    <property name="prefix"> 
     <value>/WEB-INF/views/</value> 
    </property> 

    <property name="suffix"> 
     <value>.jsp</value> 
    </property> 
</bean> 

web.xml

<servlet> 
    <servlet-name>spring-dispatcher</servlet-name> 
     <servlet-class> 
     org.springframework.web.servlet.DispatcherServlet 
     </servlet-class> 
</servlet> 

<servlet-mapping> 
    <servlet-name>spring-dispatcher</servlet-name> 
     <url-pattern>/</url-pattern> 
</servlet-mapping> 

Answer 1

Wenn Sie das Inline-Formularfeldüberprüfung behandeln möchten, müssen Sie <form:errors für jede hinzufügen Feld in der HTML form zu validieren und mit einer Fehlermeldung angezeigt werden.

Außerdem müssen Sie die Daten mit @Valid oder benutzerdefinierten Validator in der Controller-Methode validieren alle Fehler aus dem Formular zurückzukehren und Sie here oder here für eine einfache Beispiele aussehen kann.