JQuery $.getJSON appends a question mark to the request URL

Question

I have the folliwng JSON request code on an ASP.NET MVC web application:

var userID = 'id=' + $('#namesList').val();
        $.getJSON('/Person/GetPerson/', userID, function(data) {
            $('#collar').text(data.collarNumber);
            $('#name').text(data.Name);
            $('#email').text(data.EmailAddress);
        });

This creates a request such as: http://localhost:48610/Person/GetPerson/?id=6. Why is there a question mark in there? I get the server error The parameters dictionary contains a null entry for parameter 'id' of non-nullable type 'System.Int32'....

If I make the request manually without the question mark it works fine.

Answer 1

The getJSON does a GET request, and doesn't post variables to the url, but instead adds them to the querystring. Instead use $.post.

 $.post('/Person/GetPerson/', { id: $('#id').val() }, function(data) {
        $('#collar').text(data.collarNumber);
        $('#name').text(data.Name);
        $('#email').text(data.EmailAddress);
    }, 'json');

Or when your syntax to the page is /Person/GetPerson/123, just append the id to the url, and put { } in the place of the data parameter.

Answer 2

Because GET parameters are separated from the file with a question mark.

If you do not want the question mark, append the data directly to the URL and pass an empty data object (null might also work)

Answer 3

It's passing the userID you specify in getJSON as a querystring, which is a pretty standard way to pass around variables. Can you support for the querystring at the server end, when parsing incoming URL requests?

Answer 4

That is how the getJSON function works. The following will work:

 $.getJSON('/Person/GetPerson/'+userID,, function(data) {
        });

Answer 5

You're making a GET request and passing a name/value pair as the second argument, which is the argument for data to be specified in the request. jQuery automatically appends the ? because it's required in order for the name/value pair to be correctly sent.

Try passing null as the second parameter if you don't want any data to be sent.

http://api.jquery.com/jQuery.getJSON/

Answer 6

Parameters in the URL go, by definition, after an "?". In MVC, route parameters are not actually parameters (for the web browser), but part of the path. As such, the correct code would be:

    var userID = $('#namesList').val();
    $.getJSON('/Person/GetPerson/' + userID, null, function(data) {
        $('#collar').text(data.collarNumber);
        $('#name').text(data.Name);
        $('#email').text(data.EmailAddress);
    });

Replace null with a list of parameters when your controller actually accepts extra values not in the MVC route. Ex, your controller might be:

    public function GetPerson(string id, string type) {
         // your code
    }

and you would call it like this:

    var userID = $('#namesList').val();
    var params = "type=XXX";
    $.getJSON('/Person/GetPerson/' + userID, params, function(data) {
        $('#collar').text(data.collarNumber);
        $('#name').text(data.Name);
        $('#email').text(data.EmailAddress);
    });