ASP.NET MVC and JQuery get info to controller

Question

I am totally confused on how to do ajax stuffs with jQuery and it seems the more I try the more confused I get. At this point all I want to do is get data to my controller

Answer 1

Use a tool such as firebug to make sure that the url you expect is being called.

Debugging routine =>

1. Use Firbug to determine that the correct url is being called and the correct data is being sent in the post
2. Break the call in the action and make sure the parameters are being populated correctly
3. Use Firebug again to check the response

IE developer Toolbar can also be used instead of Firebug if you prefer IE. if the call url and post data seem correct, and the action isn't being called you should check your routing rules. ie does it have any default values in which case the MVC framework will be looking for a method signature that contains those default values (do you have {id} in your url rule?)

Answer 2

It has to do with the way you're structuring your request. Your JQuery call is sending the data to the AddLink action on the User controller as POST data, which means in your C# code, you'll access it via the Request.Form object. With what you're trying to do, you'd structure the jQuery URL as

/User/AddLink/{Title}/{URL}

This would require you to write a rule in your Global.ASAX file that handled that sort of input. In short, if you just modify your AddLink method as follows:

public ActionResult AddLink()
{
    return Json(new { Result = string.Format(Request.Form["title"] + " " + Request.Form["url"])});
}

I believe you'll get the response you're looking for.

Answer 3

have you tried using the jQuery.post method should be something like

jQuery.post("/User/AddLink",AjaxLink,function(data,textStatus)
{
  if(textStatus=="success")
  {
    //do something with data which is the result from the call}
  }
  else
  {
  //failed somewhere along the line
  }
},"json");

post values are mapped to parameters in the MVC call so foxxtrot's code should be unnecessary.

Answer 4

Have you tried writing out the full URL? I had a project running on my local IIS that had the same problem. The full url was http://localhost/myproject/user/addlink, but using "/user/addlink" in the jQuery ajax call was submitting to http://localhost/user/addlink (notice that "myproject" is missing because it's not actually the base url as far as jQuery knows).

Answer 5

I haven't taken the time to test it yet but it looks like it should work, the one think I would make sure is that you decorate the controller function to let it know it is looking for a post like the following:

[HttpPost]
public ActionResult AddLink()
{
    return Json(new { Result = string.Format(Request.Form["title"] + " " +     Request.Form["url"])});
}

I should have time to test it this afternoon if none of these solutions work for you.

Answer 6

So I was having a little bit of a time trying to figure out how to get data back from an AJAX call. I was passing an JSON object from the view to the controller, and then return the ID of the object when it's done.

So, I finally got that working, and here's what I did on the view:

var obj = {
   property1 : '',
   property2 : ''
};

$.ajax({
    // Returns the full url
    url: '@Url.Action("Method", "Controller")', 
    // Sends as a json object, I actually have an object that maps to my ViewModel, this is just for explaining
    data: obj, 
    // You are telling that you are receiving a json object
    dataType: 'json', 
    success: function (id) {
       // do code here with id
    }
})

For my controller, I returned a Json object and did an AllowGet as a JsonRequestBehavior

public ActionResult Method (ViewModel vm)
{
    int id = ... (do something with the vm)
    return Json(id, JsonRequestBehavior.AllowGet);
}

Edit: In addition, it appears you have POST as the type of request to the controller, and your controller method doesn't have the [HttpPost] annotation. That could also be the case.

I hope this helps!
Cheers!