how to send and get query parameters in jquery

Question

Hi I am quite new to jquery and web programming in general.

My question is how to send hidden query parameters using a post request in jQuery and Retreive the data from the post request in another. I know that there are a lot of tutorials on .post in jQuery but I cant seem to find any on .get requests (if that is what I need here)

For example in one .js file for one page I have

$.ajax({
    type: 'POST',

    url: 'url',
    data: {
       'startDate': this.options.startDate,
       'endDate': this.options.endDate,
       'selectedReport': this.options.endDate,
    },
    success: function (msg) {
       alert('wow' + msg);
    }
});

but in another js file for another page I want to have like a get request that retrieves these parameters.

Could anyone explain how would I write this get request in the js file to retrieve them?

Thank you for the help

Piotr · Answer 1 · 2014-03-06T20:00:30.533

2

It seems to me that POST data is data that is handled server side. And Javascript is on client side. So there is no way you can read a post data using JavaScript.

edited Mar 06 '14 at 20:00

answered Mar 06 '14 at 19:37

Piotr

187
12

score 1 · Answer 2 · answered Mar 06 '14 at 19:40

With your current function you are sending POST data to the otherside. For example, in PHP, data sent will be in the $_POST array.

To set a GET request you just have to set type from POST to GET

type: 'GET'

Then on the PHP side data sent will be in $_GET array.

score 1 · Accepted Answer · answered Mar 06 '14 at 19:46

1

.ajax() POST data is send as query string parameters. In the other page you can write javascript to fetch these query string values.Below is sample to read query string values:

(function ($) {
            $.QueryString = (function (a) {
                if (a == "") return {};
                var b = {};
                for (var i = 0; i < a.length; ++i) {
                    var p = a[i].split('=');
                    if (p.length != 2) continue;
                    b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
                }
                return b;
            })(window.location.search.substr(1).split('&'))
        })(jQuery);

You can the above function like below:

var startDate=$.QueryString["startDate"];

https://api.jquery.com/jQuery.ajax/

answered Mar 06 '14 at 19:46

Unnie

918
8
30

Hi thanks for the help! I am a bit confused because I thought that the post request would send the parameters as hidden and not in the url so i am not sure if this works for me. – James Mar 06 '14 at 19:52
1

.ajax() documentation: data : PlainObject or String 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 based on the value of the traditional setting – Unnie Mar 06 '14 at 19:56

score 1 · Answer 4 · edited May 23 '17 at 11:49

1

I realized that JavaScript post request like a form submit answers my questions because it is more client side although the ajax is server side. thank you for all of the help!

edited May 23 '17 at 11:49

Community

1
1

answered Mar 06 '14 at 20:02

James

557
1
12
29

how to send and get query parameters in jquery

4 Answers4