HMdeveloper
HMdeveloper

Reputation: 2884

sending array by ajax call in angular js

I use the following code to send some information to my servlet to process data:

 $http({
                method: "GET",
                url: "http://localhost:8080/purchase/AddInfo",
                data: {
                    addArray : "sample"
                }
            })
                .success(function (data, status, headers, config) { 
                     typesHash.push( {id:data.id,name : data.name, price : data.price,unit:2.5 });
                })
                .error(function (data, status, headers, config) { 

                });

and it works perfectly; but as you can see I want to send the parameters as an array not a string , lets say I have an array as follow:

  var typesHash=[
                 {id:'1', name : 'lemon', price : 100,unit:2.5 },       
                 {id:'2', name : 'meat', price : 200,unit:3.3  }];

now I want to send this array to the server, one quick and ugly way is to loop through the array that I have and send send the information as an string but I believe there should be a better way , can any one help?

Update: as it is suggested I changed my code to the following :

 $http({
                method: "post",
                url: "http://localhost:8080/purchase/AddInfo",
                    addArray : typesHash

            })
                .success(function (data, status, headers, config) { 
                     typesHash.push( {id:data.id,name : data.name, price : data.price,unit:2.5 });
                })
                .error(function (data, status, headers, config) { 

                });

But I get null when I try to rceive it and this is how I receive it in my servlet:

String arr= request.getParameter("addArray");
    System.out.println(arr);

Update 2:Here is the most updated code

My servlet:

protected void doGet(HttpServletRequest request,
        HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub

    String actionType = request.getParameter("addArray");
    System.out.println(actionType);
    PrintWriter out = response.getWriter();
    response.setContentType("text/html");
    String str = "{ \"id\": \"1\",\"name\": \"ali\",\"price\": \"100000\"}";
    // System.out.println(str);
    out.println(str);
}

/**
 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
 *      response)
 */
protected void doPost(HttpServletRequest request,
        HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub
    doGet(request, response);

}

My js:

 $http({
                method: "post",
                url: "http://localhost:8080/purchase/AddInfo",
               data: { addArray : typesHash } 


            })
                .success(function (data, status, headers, config) { 
                     typesHash.push( {id:data.id,name : data.name, price : data.price,unit:2.5 });
                })
                .error(function (data, status, headers, config) { 

                });

Upvotes: 2

Views: 2073

Answers (2)

squiroid
squiroid

Reputation: 14027

Hey you can do it like this :-

 $http({
      method: 'POST',
      headers: {'Content-Type': 'application/json'},
      url: "http://localhost:8080/purchase/AddInfo",
      data: { addArray : typesHash } 


        })
            .success(function (data, status, headers, config) { 
                 typesHash.push( {id:data.id,name : data.name, price : data.price,unit:2.5 });
            })
            .error(function (data, status, headers, config) { 

            });

Source :-http://www.doublecloud.org/2013/09/angular-javascript-framework-interacting-with-java-servlet-backend/

Upvotes: 1

Matan Gubkin
Matan Gubkin

Reputation: 3099

HTTP has several methods in it: 'GET' - allows you to accept data from a the requested server. 'POST' - allows you to send data to the server and accept. 'PUT' - update data etc...

try this code:

$http({
            method: "post",
            url: "http://localhost:8080/purchase/AddInfo",
                {addArray: typesHash}

        })
            .success(function (data, status, headers, config) { 
                 typesHash.push( {id:data.id,name : data.name, price : data.price,unit:2.5 });
            })
            .error(function (data, status, headers, config) { 

            });

Upvotes: 0

Related Questions