Passing object to MVC 4 Web API using jQuery AJAX

Question

I am trying to create a web api that can accept objects as parameters...I started with the simple example posted below, but I get an Internal Server Error

My AJAX:

var order = {
    "id": 1012345,
    "carrier": "works",
    "created_at": "works",
    "description": "works",
    "etd": "works",
    "invoice_id": 12,
    "origin_id": 13,
    "po_number": "101",
    "shipped_on": "works",
    "status": "works",
    "updated_at": "works"
};

$.ajax({
    url: "http://localhost:3495/api/NTOrder/",
    type: "GET",
    data: { inputOrder: order },
    beforeSend: function(xhr){
        xhr.setRequestHeader('username', 'user4');
        xhr.setRequestHeader('password', 'secret');
    },
    success: function(data) { 
        alert('Success!' + JSON.stringify(data)); $('.result').html(data); 
    }
});

In Chrome, it gives me the 500 Internal Server Error when trying to access the url:

http://localhost:3495/api/NTOrder/?inputOrder%5Bid%5D=1012345&inputOrder%5Bcarrier%5D=works&inputOrder%5Bcreated_at%5D=works&inputOrder%5Bdescription%5D=works&inputOrder%5Betd%5D=works&inputOrder%5Binvoice_id%5D=12&inputOrder%5Borigin_id%5D=13&inputOrder%5Bpo_number%5D=101&inputOrder%5Bshipped_on%5D=works&inputOrder%5Bstatus%5D=works&inputOrder%5Bupdated_at%5D=works

Did it create the url string incorrectly?

My code on the MVC side is very simple:

public IEnumerable<NTOrder> GetOrders(NTOrder inputOrder)
{
    List<NTOrder> NTOrderList = new List<NTOrder>();
    NTOrderList.Add(inputOrder);
    return NTOrderList;
}

The class NTOrder is pretty simple, and just contains the attributes used in the original AJAX.

jessegavin · Accepted Answer · 2012-09-25 16:23:57Z

3

If you're ok with switching to POST rather than GET, you could do it this way. You might have better luck.

$.ajax({
    url: "http://localhost:3495/api/NTOrder/",
    type: "POST",
    data: JSON.stringify({ inputOrder: order }),
    dataType: "json",
    beforeSend: function(xhr){
        xhr.setRequestHeader('username', 'user4');
        xhr.setRequestHeader('password', 'secret');
    },
    success: function(data) { 
        alert('Success!' + JSON.stringify(data)); $('.result').html(data); 
    }
});

answered Sep 25, 2012 at 16:23

jessegavin

75.8k28 gold badges141 silver badges165 bronze badges

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

Collectives™ on Stack Overflow

Passing object to MVC 4 Web API using jQuery AJAX

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related