C# MVC 无法在 Bootstrap 选项卡中加载部分视图

Question

I can't get partial views to load at all. I am trying to have a partial view load from a controller action for a section of my index view but the code's not doing anything. It's not even erroring or triggering any functions in the controller. This is my relevant code so far

HomeController.cs

        public IActionResult Index()
        {
            return View();
        }
        
        [HttpGet]
        public PartialViewResult PartialBlock()
        {
            var dataItems = _db.Data
                .OrderBy(t => t.Title)
                .ToList();

            return PartialView("_PartialBlock", dataItems);
        }

Views/Home/Index.cshtml

<div id="partialViewContainer"  class="card-deck">
  <div class="row">
    <a id="loadView" asp-action="PartialBlock"></a>;  
  </div>
</div>

<script>
$('#loadView').on('load', function() {
    $.ajax({
        type: "GET"
        url: '/Home/PartialBlock',
        success: function (data, textStatus, jqXHR) {
            $('#partialViewContainer').html(data);
        }
    });
});
</script>

Views/Home/PartialBlock.cshtml

@model List<Data>

@foreach (var dataitem in Model)
{
    <div class="card">
        <div class="card-body">
            <h5 class="card-title">@dataitem.Title</h5>
            <p class="card-text">@dataitem.Info</p>
            <p class="card-text"><small class="text-muted">More Text</small></p>
        </div>
    </div>
    </div>
}

Answer 1

$('#loadView').on('load', function() {

This method cannot trigger load correctly. You can use jQuery's load method：

$('#loadView').load('/Home/PartialBlock', function (data) {
       $('#partialViewContainer').html(data);
 })