POST Json data using Java script

Question

I have a Java snippet code already implemented as follows:

          //some logic above

            JSONObject json = new JSONObject();

            try {

                    json.put("name", "myname");

                    json.put("address","myaddress");


                  List<NameValuePair> nameValuePairs = new ArrayList<NameValuePair>();

                  nameValuePairs = Utils.addEmpName(nameValuePairs);

                  nameValuePairs = Utils.addEmpAddress(nameValuePairs);


                  nameValuePairs.add(new BasicNameValuePair(

                            "myjsondata",

                            jsondata.toString());

                  ....

               httpPost.setEntity(new UrlEncodedFormEntity(nameValuePairs));
           }

It does a POST request to my server and sends the JSON data.

My question is how do I perform the same in Javascript. I know how to construct the JSON data but as far as nameValuePairs are concerned, can anyone tell me how to send them as my JSON body via javascript?

My Javascript code looks like this at present in Javascript

var data= { "name":"myname", "address" : "myaddress" };            
var xhr = new XMLHttpRequest();

xhr.open("POST",my_url,true);
xhr.setRequestHeader("Content-type", "application/json;charset=UTF-8");
xhr.send(JSON.stringify(data));

I need help in writing the nameValuePairs part in order to construct json body

injecteer · Accepted Answer · 2014-01-25 15:18:50Z

2

Almost any modern JavaScript framework like jQuery or prototype has very simple methods to send/receive json(-like) objects to/from a server

UPDATE:

jQuery:

var d = { "aa":"bbbbb", "xxx":"yyyy" };
$.ajax({ 
  url:'http:yourserver.com/your_action',
  data:d
});

Prototype:

var d = { "aa":"bbbbb", "xxx":"yyyy" };
new Ajax.Request( 'http:yourserver.com/your_action', { parameters:d } );

Your can customize what to do on successful send, on failure etc. see http://api.jquery.com/jQuery.ajax/ and http://api.prototypejs.org/ajax/Ajax/Request/

edited Jan 25, 2014 at 15:18

answered Jan 25, 2014 at 14:04

injecteer

20.8k4 gold badges53 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Parth Doshi Over a year ago

can u give an example?

Parth Doshi Over a year ago

Yes got that but how to send namevaluepairs..see my Java code above..i Have to send EmpName and 'EmpAddress` also. That too as URL encoded entity. Please tell me how to do that

injecteer Over a year ago

not sure what you exactly mean by that... var d = { "EmpName":"EmpName value", "EmpAddress":"EmpAddress value" }; might do

Sureshkumar Saroj · Accepted Answer · 2014-01-25 14:22:05Z

0

You should use JQuery instead of manually handling XHR requests.

You can either use $.ajax() or $.post() functions.

$.post( my_url, { "name":"myname", "address" : "myaddress" });

Edited: To pass custom HTTP headers, use $.ajax() instead of $.post(). Although the header you are referencing to use standard header and JQuery should detect and automatically add this to above request. Anyway, you can use following code snippet to achieve the same using $.ajax().

$.ajax({
    url: my_url,
    type: 'post',
    data: { "name":"myname", "address" : "myaddress" },
    headers: {
        "Content-type": "application/json;charset=UTF-8"
    },
    dataType: 'json',
    success: function (data) {
        console.info(data);
    }
});

edited Jan 25, 2014 at 14:22

answered Jan 25, 2014 at 14:10

Sureshkumar Saroj

1092 bronze badges

4 Comments

Parth Doshi Over a year ago

yes that's fine. My question is how do I send nameValuePairs as json body via javascript..My request requires me to send headers and json data along with namevaluepairs

Parth Doshi Over a year ago

I am familiar with the java code..I need some help forming the javascript code since I can't use java

Sureshkumar Saroj Over a year ago

You can pass custom HTTP headers in JQuery ajax function.

Parth Doshi Over a year ago

how to send namevaluepairs..see my Java code above..i Have to send EmpName and 'EmpAddress` also. That too as URL encoded entity. Please tell me how to do that

Collectives™ on Stack Overflow

POST Json data using Java script

2 Answers 2

3 Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related