Calling Partial View Using JQuery

Question

I have a partial view defined like this in my /Shared folder

<div id="myProducts">
  @Html.Partial("_ProductsList",Model)
 </div>

I want to load _ProductsList through JQuery. Basically, I am trying to refresh my _ProductsList view on button click. I tried to do like this:

$('myProducts').Load(/Shared/_ProductsList)

But I get a "resource not found error".

A previous question is asking something different, one of the answers to the question demonstrate how to load a partial via AJAX. (Disclaimer: I posted an answer to that question myself—though my answer doesn't actually address your question; the others might.) — Jeremy Caney
– Jeremy Caney, Commented Aug 11, 2021 at 18:55
Aside, /Shared/_ProductsList should be in quotes within your jQuery. I assume that's a typo. Also, can you confirm that you're able to navigate to /Shared/_ProductsList and get a response back? That will help confirm that this isn't a routing issue. — Jeremy Caney
– Jeremy Caney, Commented Aug 11, 2021 at 18:58
You need to create a method in the controller which returns the /Shared/_ProductsList partial view. You can call this method from the jquery as you do with other views — Beingnin
– Beingnin, Commented Sep 4, 2021 at 4:09

Serge · Accepted Answer · 2023-04-19 17:16:42Z

2

try to use this ajax code

        $.ajax({
        
            url: "/MyController/MyAction",
            type: "POST", //or "GET" if you don't send body data
            success: function (result) {
                    $("#myProducts").html(result);
            },
            error: function (xhr, exception) {
               
            }
        });

and the action

public partial class MyController : Controller
{
  public IActionResult MyAction()
  {
      var model=new myModel { ... assign model properties  };
     return PartialView("_ProductsList", model);
 }
}

edited Apr 19, 2023 at 17:16

answered Aug 11, 2021 at 17:39

Serge

44.4k4 gold badges26 silver badges53 bronze badges

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

Collectives™ on Stack Overflow

Calling Partial View Using JQuery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related