从超链接渲染部分视图

时间:2018-05-22 15:28:32

标签: jquery ajax asp.net-core partial-views

我有一个ASP.NET核心MVC网络应用程序。

我在我的Index.html页面中有这个:

<div class="carousel-caption" role="option">
    <p>
        Upgrade your Legacy VB6 Applications to .Net Core!
        <a class="btn btn-default" id="VB6Upgrades">
            Learn More
        </a>
    </p>
</div>

<div id="MainContent" class="row">

</div>

我的JS档案:

$("#VB6Upgrades").click(function () {
    $.get('@Url.Action("LoadVB6Upgrades","/Home")', {}, function (response) {
        $("#MainContent").html(response);
    });
});

我的控制器:

public class HomeController : Controller
{
    public IActionResult Index()
    {
        return View();
    }

    public IActionResult Error()
    {
        ViewData["RequestId"] = Activity.Current?.Id ?? HttpContext.TraceIdentifier;
        return View();
    }

    public IActionResult LoadVB6Upgrades()
    {
        return PartialView("_LoadVB6Upgrades");
    }
}

当我点击链接时,会调用Index()函数吗?

我该怎么办?

1 个答案:

答案 0 :(得分:0)

您必须将数据类型设置为html,以便在div中加载部分视图。默认数据类型是json,您可以在这里查看stackoverflow.com/questions/30953714/whats-default-datatype-of-jquerys-ajax-and-get-methods

  $("#VB6Upgrades").click(function () {
      $.ajax({
            type: "GET",
            url: '@Url.Action("LoadVB6Upgrades","Home")',
            dataType: "html",
            success: function (result) {
                if (result) {
                     $("#MainContent").html(result);
                }
            },
            error: function (result) {
             $("#MainContent").html('');
            }
        });
    });