jQuery: why does $.post does a GET instead of a POST

Question

I'm trying to do an ajax call and populate the "Data" div with the results of the ajax call, but i get an error saying: "Server Error in '/' Application. The resource cannot be found. Description: HTTP 404. Requested URL: /Home/GetStuff" When I look with Firebug the request was a GET to /Home/GetStuff and the answer was 404 Not found. Why I doesn't do a POST as I required in the ajax call? How can I do a POST?

I tried using $.post and got the same behavior, though I haven't checked the jquery code, I assume $.post is a wrapper around $.ajax.

Also i tried Ajax.ActionLink and it works fine, though I would like to use jQuery and not the Microsoft's ajax js libraries.

The code follows:

Home/TestStuff.aspx

function aClick() {
    $.ajax({
        type: "POST",
        url: $("#MeFwd").href,
        data: ({ accesscode: 102, fname: "JOHN", page: 0 }),
        dataType: "html",
        success: renderData
    });
};

function renderData(data) {
    $("#Data").html(data.get_data());
}


<div id="Data">
</div>
<div id="link">
    <a href="<%= Url.Action("GetStuff", "Home") %>" id="MeFwd" onclick="aClick"> Click Me!</a>
</div>

HomeController.cs

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult GetStuff(int accessCode, string fName, int? page)
{

return "<table><tr><td>Hello World!</td></tr></table>";
}

score 6 · Accepted Answer · answered Aug 13 '09 at 12:37

6

Change your onclick="aClick" to onclick="aClick(); return false;". Clicking the link is doing a get to the url instead of running your JS.

answered Aug 13 '09 at 12:37

BStruthers

958
6
8

1

This will disable the link but the url.Action is what's causing the GET in the first place. By adding the return false like BStuthers said here, it should clear up the issue. – JamesEggers Aug 13 '09 at 12:48
You don't think him calling renderData and not passing anything to it could be a problem as well? – Martin Aug 13 '09 at 12:50
I've changed onclick="aClick" to onclick="aClick(); return false;" and it worked just fine. It seems calling renderData as is works just fine, well except it should say: $("#Data").html(data); Thanks so much everyone. – alexs Aug 13 '09 at 13:14

Martin · Answer 2 · 2009-08-13T12:50:45.330

$('#MeFwd').click(function() {
    $.ajax({
        type: "POST",
        url: $("#MeFwd").href,
        data: ({ accesscode: 102, fname: "JOHN", page: 0 }),
        dataType: "html",
        success: function(data){
            $("#Data").html(data);
       });
    });
};

I don't think you can call a function on your return ... but I could be wrong.

Or look into load: http://docs.jquery.com/Ajax/load#urldatacallback

jQuery: why does $.post does a GET instead of a POST

2 Answers2

Linked