post method not working in angular js

Question

I am trying to add data's in table by using angularjs, spring, and hibernet. Below is the code that I am using :

addCustomer.js

var addNewCustomerModule = angular.module('addNewCustomer',[]);
var c=angular.module('addCustomerController',[]);

addNewCustomerModule.controller('addCustomerController', function ($scope,$http) {

    //$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

     var urlBase="http://localhost:8081/manufacturing";
     var customerDetails={};
     $scope.addCustomer = function addCustomer() {
         customerDetails=$scope.customer;  
         alert("hai");
         $http.post(urlBase + '/addCustomer/new/',customerDetails).
            success(function(data) {
               alert("Customer added");
               $scope.customer = data; 
              });
          } 
     });

addCustomer.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

    pageEncoding="ISO-8859-1"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html ng-app="addNewCustomer">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add Customer</title>
<script data-require="angular.js@*" data-semver="1.2.13" src="http://code.angularjs.org/1.2.13/angular.js"></script>
<script src="<c:url value="/resources/js/addCustomer.js"/>"></script>
</head>
<body>
<div ng-controller="addCustomerController">

<table>

     <tr>
      <td> FirstName:</td>
      <td><input type="text" ng-model="customer.firstName"/></td>
      <td>LastName:</td>
      <td><input type="text" ng-model="customer.lastName"/></td>    
     </tr>

     <tr>
      <td>Designation</td>
      <td><input type="text" ng-model="customer.designation"/></td>
      <td>Email</td>
      <td><input type="text" ng-model="customer.email"/></td>
     </tr>

     <tr>
      <td>Phone</td>
      <td><input type="text" ng-model="customer.phone"/></td>
      <td>Fax</td>
      <td><input type="text" ng-model="customer.fax"/></td>
     </tr>

     <tr>
      <td>Website</td>
      <td><input type="text" ng-model="customer.website"/></td>         
      <td>ContactType</td>
      <td><input type="text" ng-model="customer.contact_type"/></td>
     </tr>

     <tr>
      <td>AddressTitle</td>
      <td><input type="text" ng-model="customer.addressTitle"/></td>         
      <td>AddressLine1</td>
      <td><input type="text" ng-model="customer.addressLine1"/></td>         
     </tr>

     <tr>
      <td>AddressLine2</td>
      <td><input type="text" ng-model="customer.addressLine2"/></td>
      <td>City</td>
      <td><input type="text" ng-model="customer.city"/></td>
     </tr>

     <tr>
      <td>State</td>
      <td><input type="text" ng-model="customer.state"/></td>
      <td>Country</td>
      <td><input type="text" ng-model="customer.country"/></td>
     </tr>

     <tr>
      <td>PinCode</td>
      <td><input type="text" ng-model="customer.pincode"/></td> 
     </tr>

     <tr>
      <td>Type</td>
      <td><input type="text" ng-model="customer.type"/></td>
      <td>Name</td>
      <td><input type="text" ng-model="customer.name"/></td>
     </tr>

     </table>

     <button ng-click="addCustomer()" class="btn-panel-big">Add New Customer</button></td>
     </div>
</body>
</html>

spring controller

 @RequestMapping(value="/addCustomer/new/",method=RequestMethod.POST)
    public String updateUser(@RequestBody Customer cu,HttpSession session) throws ParseException{
      customerService.addCustomer(cu);
      return "addCustomer";
  }

Here $http.post(urlBase + '/addCustomer/new/',customerDetails) it doesn't call my spring controller.i checked in browser debug it says url 404 error but i have the controller for this url. i don't know how to fix this can any one help me to fix this

I think issue is with your spring controller .. please check your request mapping log at console. — Ajit Soman, Jul 22 '17 at 07:41
i check with other post methods used in my application that are also not working — KVK, Jul 22 '17 at 07:41
@AjitSoman there is no error in my console yesterday my post method works in other pages today no pages are work with post method — KVK, Jul 22 '17 at 07:43
Are you not able to hit any post method calls with your postman. — Ajit Soman, Jul 22 '17 at 07:46
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/149871/discussion-between-ajit-soman-and-kvk). — Ajit Soman, Jul 22 '17 at 08:24
@AjitSoman i tried to upload zip file in chat room but i can't so can you send your mail id i will send — KVK, Jul 22 '17 at 09:45

score 1 · Accepted Answer · answered Jul 22 '17 at 11:56

The issue is that your are using $http.(..).sucess() function with angular js version 1.6.X . Angular js team has removed success() and error() method from $http. Here is the link:Why are angular $http success/error methods deprecated? Removed from v1.6?

You need to use then() function with $http. Like this:

    $http.post(urlBase +'/addCustomer/new/',customerDetails).then(function(data) {
        console.log(data);
    },function(error){
        console.log(error);
    });

post method not working in angular js

1 Answers1