jQuery AJAX works to return mvc 3 partial view but jQuery load doesn't

Question

I'm trying to populate a div with a partial view in MVC 3. My controller looks like this:

[HttpPost]
public ActionResult GetCustomerList(string searchString)
{
    var custService = new CustomerViewModels();
    var custListVM = custService.GetSearchList(searchString);

    return PartialView("GetCustomersList", custListVM);
}

and my jQuery call looks like this:

function getCustomerList(searchCriteria) {
    $.ajax({
        url: 'Home/GetCustomerList',
        type: 'POST',
        async: false,
        data: { searchString: searchCriteria },
        success: function (result) {
            $("#customerTabBody").html(result);
        }
    });
};

It works fine. I began to wonder if I could use the jQuery load method to do the same thing with a lot less code and wrote this:

function getCustomerList(searchCriteria) {
    $("#customerTabBody").load('Home/GetCustomerList', { searchString: searchCriteria });
};

It returns an error saying the resource can't be found. I've tried using @Url.Action but it encodes the same controller path I have hard coded. In Firebug I can see that the URL that is being posted to is the same and the searchString parameter is identically formatted in both instances.

What's the difference - why does load not work?

Thanks

I need to keep the user from continuing to type in characters while I await the response. — BKahuna
– BKahuna, Commented Jul 25, 2011 at 6:36

Muhammad Adeel Zahid · Accepted Answer · 2011-07-25 05:19:04Z

2

Jquery docs for load says...

The POST method is used if data is provided as an object; otherwise, GET is assumed.

since you are passing data as an object, it has to be a post call according to docs. Furthermore, you are getting required data from controller through $.ajax so controller action method seems to be alright. There may be some error when sending the ajax request using load. you can inspect this in firebug.

answered Jul 25, 2011 at 5:19

Muhammad Adeel Zahid

17.8k16 gold badges95 silver badges160 bronze badges

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

2 Comments

BKahuna Over a year ago

I've used Firebog to look carefully at the post data and the target controller URL is identical in both and so is the searchString key, value pair.

Muhammad Adeel Zahid Over a year ago

check the response of ajax request in firebug

Allen Wang · Accepted Answer · 2011-07-25 15:17:04Z

1

Can you try this to see if it works?

function getCustomerList(searchCriteria) {

         $('#customerTabBody').load('@Url.Action("GetCustomerList", "Home")', { 'searchString': searchCriteria });

};

answered Jul 25, 2011 at 15:17

Allen Wang

9988 silver badges12 bronze badges

Comments

lsuarez · Accepted Answer · 2011-07-25 04:44:42Z

0

I'm fairly certain your .load() call executes a GET request rather than a POST. MVC 3 and most other .NET AJAX transactions (methods decorated as a WebMethod, such as web services and page methods) require data to be POSTed. In this case you'll simply need to stick with what works. As you can see in your working $.ajax() call, the request method is a POST. If you want to short-hand some of the code, use .ajaxSetup() combined with .post().

answered Jul 25, 2011 at 4:44

lsuarez

4,9921 gold badge31 silver badges51 bronze badges

2 Comments

Muhammad Adeel Zahid Over a year ago

asp.net mvc controller action methods do not require each ajax request to be post unless they are decorated with HttpPost. The only exception is the methods that return json result. even in that case you can allow Get requests like return Json(data,JsonRequestBehavior.AllowGet);

BKahuna Over a year ago

Actually I wondered about that too. I tried decorating my controller method with [HttpGet] but it still couldn't even find the resource so I don't think it mattered. I also took at look at the post and response traffic in Firebug and it shows the postback generated by the jQuery load and it is displayed as a post (not a get).

Collectives™ on Stack Overflow

jQuery AJAX works to return mvc 3 partial view but jQuery load doesn't

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related