JQuery AJAX syntax

Question

I am trying to find the correct syntax to pass a varible to my JQuery Post.

var id = empid;

$.ajax({
    type: "POST",
    url: "../Webservices/EmployeeService.asmx/GetEmployeeOrders",
    data: "{empid: empid}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(result) {
        alert(result.d);
    }

I don't think the data: value is quite right. Someone set me straight?

Thanks!

score 19 · Accepted Answer · edited Jan 04 '14 at 15:29

19

How about this:

var id = empid;

$.ajax({
    type: "POST",
    url: "../Webservices/EmployeeService.asmx/GetEmployeeOrders",
    data: "{empid: " + empid + "}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(result){
        alert(result.d);
        console.log(result);
    }
});

edited Jan 04 '14 at 15:29

Dexter

18,213
4
44
54

answered Apr 23 '09 at 02:11

Jose Basilio

50,714
13
121
117

1

I am trying to hit an ajax request via postman. The ajax request is sending dataType:` json` and data: {loginId: "appletest@somedomain.com", client: "698983"}. While going into the postman, I am trying to send body parameters as JSON with all the above info and Content-Type: application/json in headers but it fails with 500. Any help ? – nr5 Oct 03 '19 at 07:57

score 9 · Answer 2 · answered Mar 25 '18 at 08:12

Complete ajax syntax

var data="abc";
       $.ajax({
            type: "GET",
            url: "XYZ",
            data: {
                "data":data,
            },
            dataType: "json",

            //if received a response from the server
            success: function( datas, textStatus, jqXHR) {

            },

            //If there was no resonse from the server
            error: function(jqXHR, textStatus, errorThrown){

            },

            //capture the request before it was sent to server
            beforeSend: function(jqXHR, settings){

            },

            //this is called after the response or error functions are finished
            //so that we can take some action
            complete: function(jqXHR, textStatus){

            }

        });

Worked Well. Thanks – Abhilash Singh Chauhan Jan 29 '22 at 16:30 — Abhilash Singh Chauhan, Jan 29 '22 at 16:30

score 6 · Answer 3 · answered Apr 23 '09 at 02:09

data can either be a URL encoded string or an object:

data: {empid: empid},

OR

data: "empid=" + empid,

The docs say:

Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key i.e. {foo:["bar1", "bar2"]} becomes '&foo=bar1&foo=bar2'.

score 3 · Answer 4 · answered Apr 23 '09 at 02:10

This should work for you.

$.ajax({
    type: "POST",
    url: "../Webservices/EmployeeService.asmx/GetEmployeeOrders",
    data: {empid: empid},
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(result) {
        alert(result.d);
}

score 1 · Answer 5 · edited May 23 '17 at 10:28

Though not a direct answer to your question, following is the common function approach used in one of our projects for jquery calls

$.proxy() Method

The Proxy method takes an existing function and returns a new one with a particular context.

Syntaxes

$(selector).proxy(function,context)
$(selector).proxy(context,name)

CODE

dpInvokeAsync: function (serviceRequest, input, requestType, successCallBack) {
        var url = BASE_URL + serviceRequest;
        $.ajax({
            type: requestType,
            url: url,
            async: true,
            data: input,
            dataType: 'json',
            success: $.proxy(successCallBack, this),
            error:  $.proxy(this.handleFailure, this)
        });
    }


   this.dpInvokeAsync('App/ShowParts', searchCriteria, 'Post',
                      function (result) { alert(result);}
                      );

REFERENCES

score 1 · Answer 6 · answered Apr 23 '09 at 02:13

It's not. You're passing a string, you should be passing an object literal,e.g.

data: {"empid" : empid}

See the difference? Assuming empid is a variable with some sort of value, that should work fine. Alternatively you can do this

data: "empid="+empid

http://docs.jquery.com/Ajax/jQuery.ajax#options

score 0 · Answer 7 · edited Dec 20 '12 at 11:33

0

you can use the following.

var id = empid;

$.ajax({
    type: "POST",
    url: "../Webservices/EmployeeService.asmx/GetEmployeeOrders",
    data: "var1=val1&var2=val2&var3=val3&var4=val4&var5=val5",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (result) {
        alert(result.d);
    }

edited Dec 20 '12 at 11:33

j0k

22,600
28
79
90

answered Jun 10 '10 at 06:38

khushwant

1
1
3

score 0 · Answer 8 · answered Apr 02 '22 at 11:40

0

$(document).ready(function(){ getdata(); });

function getdata(){
    $.ajax({
    url:'sample.html',
    type:'get',
    dataType:'text',
    success: succesfun,
    error: errorfun,
    complete:function(xhr, status){
        console.log("your function is success");
    }
});
}
function succesfun(hello){
    console.log("Success");
    $('#result').append(hello);
}
function errorfun(){
    console.log("Error");
}

answered Apr 02 '22 at 11:40

kaushal nena

1

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Apr 02 '22 at 12:59

score 0 · Answer 9 · answered Apr 23 '09 at 02:10

  $(document).ready(function() {
  $.ajax({
    type: "POST",
    url: "Webservices/EmployeeService.asmx/GetEmployeeOrders",
    data: "{'EmployeeId':'empid'}", **<-- see the single quotes**
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(msg) {
          alert(msg);
         }
  });
});

score 0 · Answer 10 · edited Aug 16 '12 at 13:53

0

if you want to send a JSON string to the server

data: "{empid: " + empid + "}"

if you want to send querystring params (?empid=123)

data: {empid : empid}

edited Aug 16 '12 at 13:53

Alfred

21,058
61
167
249

answered Apr 23 '09 at 02:17

Chad Grant

44,326
9
65
80

JQuery AJAX syntax

10 Answers10

Linked