mark mark - 1 year ago 116
Javascript Question

AngularJs form post data giving null values in my spring controller

Hello all i am trying to post a form using angular but i am getting null values in my spring controller.Also in my console i see null values for the sysout.Moreover i get an error alert even though i see bull is printed on my console.

My JS Controller

angular.module('ngMailChimp', ['ngAria', 'ngMessages', 'ngAnimate'])
.controller('SignUpController', function ($scope, $http) {
$["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
var ctrl = this,
newCustomer = { firstName:'',lastName:'',email:'',streetName:'',aptName:'',cityName:'',stateName:'',countryName:'', zipName:'', userName:'',password:'' };

var signup = function () {
if( ctrl.signupForm.$valid) {
ctrl.showSubmittedPrompt = true;
var formData = {
'firstName' : $scope.ctrl.newCustomer.firstName,
'lastName' : $scope.ctrl.newCustomer.lastName,
'email' : $,
'streetName' : $scope.ctrl.newCustomer.streetName,
'aptName' : $scope.ctrl.newCustomer.aptName,
'cityName' : $scope.ctrl.newCustomer.cityName,
'stateName' : $scope.ctrl.newCustomer.stateName,
'countryName' : $scope.ctrl.newCustomer.countryName,
'zipName' : $scope.ctrl.newCustomer.zipName,
'userName' : $scope.ctrl.newCustomer.userName,
'password' : $scope.ctrl.newCustomer.password

var response = $'http://localhost:8080/Weber/user/save', JSON.stringify(formData));
response.success(function(data, status, headers, config) {
response.error(function(data, status, headers, config) {
alert( "Exception details: " + JSON.stringify({data: data}));


My Spring controller

@RequestMapping(value = "/user")
public class UserRegistrationControllerImpl implements UserRegistrationController {

UserRegistrationDao userDao;

@RequestMapping(value = "/save", method = RequestMethod.POST)
public String saveUser(UserRegistration userReg) {
System.out.println(userReg.getFirstName()+" "+userReg.getLastName());
return "success";

Please help me out

Thank you

Answer Source

There is no mapper specified for converting JSON to Java object.

Use Jackson(dore, databind, annotations) if you want the JSON to be converted to object of UserRegistration.

Check this out: Convert nested java objects to Jackson JSON

Need to add below in dispatcher-servlet. This is for mapping the JSON to Java objects:

        <beans:property name="messageConverters">
                <beans:ref bean="jsonMessageConverter" />

    <!-- Configure bean to convert JSON to POJO and vice versa -->
    <beans:bean id="jsonMessageConverter"

EDIT 1: Is the method in controller something like this?

@RequestMapping(value = "/save", method = RequestMethod.POST, headers = "Accept=application/json")
public String saveUser(@RequestBody UserRegistration userReg) {
    System.out.println(userReg.getFirstName()+" "+userReg.getLastName());
    return "success";

Use above if you are not responding back to the webpage with a result to be consumed. If you want something to be returned from this method and displayed in the webpage or consumed elsewhere, the declaration of method would change to:

public @ResponseBody String saveUser(@RequestBody UserRegistration userReg)


    $ = function() {
        $ = null;
            method : 'POST',
            url : 'save',
            params : {
            firstName : $scope.ctrl.newCustomer.firstName,
            lastName : $scope.ctrl.newCustomer.lastName,
            email : $,
            streetName : $scope.ctrl.newCustomer.streetName,
            aptName : $scope.ctrl.newCustomer.aptName,
            cityName : $scope.ctrl.newCustomer.cityName,
            stateName : $scope.ctrl.newCustomer.stateName,
            countryName : $scope.ctrl.newCustomer.countryName,
            zipName : $scope.ctrl.newCustomer.zipName,
            userName : $scope.ctrl.newCustomer.userName,
            password : $scope.ctrl.newCustomer.password
        }).success(function(data, status, headers, config) {
        }).error(function(data, status, headers, config) {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download