Return view() not working with Ajax call .NET MVC

Question

I have a specific problem where I post data to my MVC action in controller like this:

$(".btnAnalyze").click(function () {
    if (jQuery.isEmptyObject(product_ids) == true) {
        alert("Array is empty");
    }
    else {
        var postData = { values: Object.keys(product_ids) };

        $.ajax({
            type: "POST",
            url: "/Analyze/Index",
            data: postData,
            dataType: "json",
            traditional: true
        });
    }
});

And this is my action:

[HttpPost]
public ActionResult Index(List<string> values)
{
    List<string> Products = new List<string>();
    foreach (var id in values)
    {
        Products.Add(GetAllProductByID(id));
    }

    return View("Index");
}

For some reason the part:

"Return view("Index") doesn't renders the view I said to render...

Any ideas how to fix this ?

a) dataType: "json" is telling the ajax client to expect JSON back, but you're trying to return HTML, and b) are you sure you don't want return PartialView()? You wouldn't normally want to return a whole view via ajax - it would try to return all the Layout template as well, which should already be in the page. — ADyson
– ADyson, Commented Oct 17, 2016 at 19:03
The whole point of ajax is to stay on the same page. If you want to redirect to the Index view, then do not use ajax. If you want to update part of the existing page, then change dataType: "json", to dataType: "html", and add a success callback to update the DOM - success: function(response) { $(someElement).html(response); } — user3559349
– user3559349, Commented Oct 17, 2016 at 20:39

Ross Bush · Accepted Answer · 2016-10-17 19:13:45Z

1

This is not going to simply refresh the view. You are calling the controller with an ajax call and this does not re/render the view, it simply returns the view as html. Can you inspect the result of that ajax call? If you test your endpoint in postman, soapui, fiddler or your browser's F12 debugger then you should see what is coming back from that ajax call. I would look into the AjaxBeginForm as an alternative to BeginForm.

Also, if you only want to do something with the data returned then simply return Json as in

return Json(Products, JsonBehavior.AllowGet);

edited Oct 17, 2016 at 19:13

answered Oct 17, 2016 at 19:01

Ross Bush

15.2k2 gold badges39 silver badges65 bronze badges

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

4 Comments

User987 Over a year ago

Yeah okay I understand your answer, but how can I make the call so it really renders the view??

Ross Bush Over a year ago

In order to do what you are describing you would need to inject the contents inside the current views parent, however, then you will lose your BeginForm. A better way would be to facilitate this as the contents of an AjaxBeginForm and have the view injected into a placeholder. That way you always have control of your form postback.

Igor Over a year ago

@User987 - there is but it requires you understand the technology you are trying to use. I recommend you read some of the many available resources out there on how to make ajax calls from the browser to fetch data and then do something with it in your html document. You can retrieve just data and use one of the many frameworks to bind that data. You can also retrieve entire html fragments and execute replacements in the DOM. But you will not get far if you do not understand the basics.

Ross Bush Over a year ago

I added a simple example on how to get data from your controller in json format. Is that what you are intending here?

Collectives™ on Stack Overflow

Return view() not working with Ajax call .NET MVC

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related