In a jQuery $.ajax() call, how do I access the data passed to the url?

Question

I have the following call to an ASPX page. The ASPX page does some stuff and returns some JSON. All of that works just fine and we won't be changing that model. However the JSON is static as we're not consuming the parameters at this point.

Within the ASPX page, how do I access the data passed to the url? For example, the varData below contains a referenceId. How do I access the value of referenceId inside the ASPX page?

function CallService()  
{ 
    $.ajax(
    {
        url         : varUrl,
        type        : varType,
        cache       : false,
        data        : varData, 
        contentType : varContentType,
        processdata : varProcessData, 
        dataType    : varDataType, 
        async       : false,
        success     : function(response) {
                    console.log(response);
                    ProcessParameters(response);
                    },
        error       : function(err) {
                    //alert("error condition triggered");
                    console.log(err);
                    },
        complete    : function() {
                    //alert("complete");
                    console.log("Complete!");
                    }

                })

        }

All the parameters above are set in this function:

function CallDlReportingService() { 

    varGuid = '12345678-1234-4567-8901-123456789012';
    varType = "GET"; 
    varUrl = "http://webServerA/page1.aspx";
    varData = '{"referenceId": "' + varGuid + '"}'; 
    varContentType = "application/json; charset=utf-8";  
    varDataType = "text";  
    varProcessData = true; 
    CallService(); 
}

Juri · Accepted Answer · 2011-11-01T18:06:45.247

3

Normally if you perform a GET request, the data is encoded in the url directly in the form of query string parameters (key-value pairs) like

http://someserver.com/somePage.aspx?id=5&filter=testfilter

So on the server-side you can just normally parse your parameters by using the Page.Request.QueryStringcollection.

In your specific case, you're trying to send JSON data in a GET request, which is somehow not so convenient because your end-result (assuming "varGuid"=abc) would look like

http://someserver.com/sompage.aspx?{%22referenceId%22:%20%22abc%22}

This makes it difficult to parse. If possible you should change your varData part s.t. it looks like

...
varData = 'referenceId=' + varGuid
...

edited Nov 01 '11 at 18:06

answered Nov 01 '11 at 18:01

Juri

32,424
20
102
136

Agreed. It's much easier to parse out a request on the server when it's sent as collection of key=value pairs. @DenaliHardtail, does JSON really give you any advantage in this context? – Mirthquakes Nov 01 '11 at 18:13
Nope, no advantage I can see. Not sure where I picked up that sample but didn't really notice the parameters being passed as JSON. Modified the request to use key-value pairs as suggested above. Tested suggestion and it works fine. Thanks! – DenaliHardtail Nov 01 '11 at 18:24
Sending data as JSON has just the advantage in the case you send it as the payload in a `POST` request, but also in that case only with ASP.net MVC. In ASP.net WebForms it is much more suitable as a form data/request parameters. – Juri Nov 01 '11 at 18:32

score 1 · Answer 2 · answered Nov 01 '11 at 18:04

1

You can access referenceId (sent via GET or POST) using the HttpWebRequest.Item() function in your server-side code.

For example:

string refId = Request.Item("referenceId").ToString();

answered Nov 01 '11 at 18:04

Mirthquakes

343
1
10

score 0 · Answer 3 · edited May 23 '17 at 11:45

According to jquery.com, the processData parameter tells AJAX to write your data into the querystring:

processData

By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

UPDATE

As @Juri pointed out, the data posted into the querystring will not be well formed, and so you may have difficulty pulling out your variables on the back end.

JQuery provides the $.param function to help with this. So, if you changed your .ajax call accordingly, it should be easy to access your JSON data through the QueryString collection.

function CallService()       {
      $.ajax(         {
         url         : varUrl,
         type        : varType,
         cache       : false,
         data        : $.param(varData), //<--change
          contentType : varContentType,
         processdata : varProcessData,
          dataType    : varDataType,
          async       : false,
         success     : function(response) {
                     console.log(response);
                     ProcessParameter(response);
                     },
         error       : function(err) {
                     //alert("error condition triggered");
                     console.log(err);
                     },
         complete    : function() {
                     //alert("complete");
                     console.log("Complete!");
                     }
         })

}

So then, on the code behind of your aspx page, your data would be accessible as

Request.QueryString["referenceId"]

Check out this example as well, it demonstrates how to deal with special characters in the json data.

In a jQuery $.ajax() call, how do I access the data passed to the url?

3 Answers3