IIS not displaying partial pages for ASP.NET Core MVC web application

I have an ASP.NET Core MVC web application that I'm trying to host in IIS (as a nested application). The problem is that when I run a page that has a partial view (a list object that displays a table), the partial view isn't being displayed.

I've checked the partial views build content and it is set to "Content". The full page has a search feature which should edit the partial list page. It works well when run from Visual Studio

In my controller, I have:

// GET the view list page
[Authorize]
public IActionResult ViewList()
{
    return View();
}

// GET partial page for the List view
[Authorize]
public IActionResult ListPartial(string type = "all")
{
    var items = GetListItems(type);

    // set the found items in the model and return view with model
    var model = new ItemModel { items = items };
    return PartialView("_ItemsList", model);
}

Then in the item full page, I have:

<link rel="stylesheet" href="~/css/ItemView.css" />
<div>
    <br />
    <h1 class="display-4">Item View</h1>

    <center><input style="justify-content: center;" class="search" id="search" name="search" type="text" placeholder="Search..." /></center>

    <div id="partialView"></div>
</div>
    @section Scripts{
        <script>
            $('#partialView').load("/Controller/ListPartial")

            $(function () {
                $("#search").keyup(function () {
                    $.ajax({
                        type: "Get",
                        url: "/Controller/ListPartial?searchText=" + $(this).val(),
                        success: function (data) {
                            $("#partialView").html("");
                            $("#partialView").html(data);
                        },
                        error: function (response) {
                            console.log(response.responseText);
                        }
                    });
                });
            });
        </script>
    }

This is the partial item list page:

@model ItemsModel;

<link rel="stylesheet" href="~/css/ItemList.css" />
<center>
<table class="table">
    <thead>
        <tr>
            <th scope="col">Name</th>
            <th scope="col" style="">Description</th>
            <th scope="col" style="">Price</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.items)
        {
            <tr>
                <td scope="row">@item.Name</td>
                <td scope="row">@item.Description</td>
                <td scope="row">@item.Price<br></td>
            </tr>
        }
    </tbody>
</table>
</center>

When I run the website in IIS and go to the itemList page, no partial page is displayed, only the search bar. If I enter the path website/controller/ListPartial, then I see the partial page displayed by itself, so I know its being published correctly, but it doesn't get displayed like it does when run from Microsoft Visual Studio. Inspecting the page shows that no errors or failed loads either.

If you have any ideas as to why this may be happening please let me know.

The following may be the same as your issue. I mean getting 404 after publishing to IIS's sub-website. If yes, then change the URL before the publishment might be a workaround.

Or we could try to set the URL as a variable which combining the root path, you might take a try but I think it looks ugly...

// $('#partialView').load("/home/ListPartial");
$('#partialView').load("@Context.Request.PathBase/home/ListPartial");