Reputation: 406
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>";
}
Upvotes: 0
Views: 2530
Reputation: 11041
$('#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
Upvotes: 0
Reputation: 958
Change your onclick="aClick" to onclick="aClick(); return false;". Clicking the link is doing a get to the url instead of running your JS.
Upvotes: 6