jQuery AJAX Call with Multiple Objects for Data Parameter

Question

I'm trying to do something like the following:

$.ajax({
    url: "/Track/Search",
    type: "POST",
    data: {
        startLatLng : { Latitude: firstClickLatLng.lat(), Longitude : firstClickLatLng.lng() },
        endLatLng : { Latitude: secondClickLatLng.lat(), Longitude: secondClickLatLng.lng() }
    },
    dataType: "json",
    success: function (msg) {
        alert("Ah har!: " + msg);
    }
});

With the following action signature:

[HttpPost]
public ActionResult Search(LatLng startLatLng, LatLng endLatLng)

And the class definition for LatLng as follows:

public class LatLng
{
    public float Latitude { get; set; }
    public float Longitude { get; set; }
}

But when I debug on the server the Longitude and Latitude fields are always null or set to zero. On the client-side this isn't the case though. I'm assuming I'm just doing something wrong with my data hash in the jQuery call.

Any ideas?

EDIT

Still no luck:

var myData = {
    startLatLng: { Latitude: firstClickLatLng.lat(), Longitude: firstClickLatLng.lng() },
    endLatLng: { Latitude: secondClickLatLng.lat(), Longitude: secondClickLatLng.lng() }
};
$j.ajax({
    url: "/Track/Search",
    type: "POST",
    data: JSON.stringify(myData),
    dataType: "json",
    success: function (msg) {
        alert("Ah har!: " + msg);
    }
});

The call is made to the server, still no data though. Fields such as firstClickLatLng.lat() definitely have data.

@down voter-- i posted in haste didn't see its the wrong tab, deleted the answer... — Rafay
– Rafay, Commented Feb 24, 2011 at 11:52

Community · Accepted Answer · 2017-05-23 10:33:08Z

0

You need to convert the JSON object into a string. Prototype has a method. You could also use JSON.stringify

edited May 23, 2017 at 10:33

CommunityBot

11 silver badge

answered Feb 24, 2011 at 11:46

kgiannakakis

104k28 gold badges163 silver badges197 bronze badges

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

2 Comments

Kieran Senior Over a year ago

How about serializeArray() in jQuery?

kgiannakakis Over a year ago

No, this is something different.

Just Jake · Accepted Answer · 2011-02-24 12:01:12Z

0

Your server is recieving a JSON string from the POST and it may not be automagically creating native objects in the manner you expect. You need to use some function to process the string into a native object in your server-side code as well before you call search(). In pseudocode:

var s = JSON.parse(recievedPostString); // convert post string to native obj or array
search( s.startLatLng, s.endLatLng ); // call your function

Also try explicitly converting your data object to a string in your client-side javascript:

...
data: JSON.stringify({ //JSON.stringify isn't multiplatform, use a wrapper for IE7 or below.
    startLatLng : { Latitude: firstClickLatLng.lat(), Longitude : firstClickLatLng.lng() },
    endLatLng : { Latitude: secondClickLatLng.lat(), Longitude: secondClickLatLng.lng() }
}),
...

answered Feb 24, 2011 at 12:01

Just Jake

4,9185 gold badges30 silver badges33 bronze badges

1 Comment

Kieran Senior Over a year ago

Chrome reports having the form data as follows

{"startLatLng":{"Latitude":49.42591053045592,"Longitude":-2.0643554687500227},"endLatLng":{"Latitude":49.29890777351432,"Longitude":-2.4021850585937727}}:

Kieran Senior · Accepted Answer · 2011-02-24 12:39:11Z

0

The following appeared to work just fine:

data: "{'startLatLng': { 'Latitude': '" + firstClickLatLng.lat() + "', 'Longitude': '" + firstClickLatLng.lng() + "'}, 'endLatLng': {'Latitude': '" + secondClickLatLng.lat() + "', 'Longitude': '" + secondClickLatLng.lng() + "'}}"

A bit frustrating really, and I'm not sure why this worked and other solutions didn't.

answered Feb 24, 2011 at 12:39

Kieran Senior

18.3k27 gold badges97 silver badges140 bronze badges

Collectives™ on Stack Overflow

jQuery AJAX Call with Multiple Objects for Data Parameter

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related