在 ASP.NET MVC Core 3.1 中通过 jQuery 为部分视图附加 html 的问题

andy 发表于 Dev

安迪

我似乎无法找到这个问题的答案，所以这里是：

我创建了一个 ASP.NET MVC Core 3.1 Entity Framework Code-First Migrations 应用程序。在其中一个实体的创建视图中，我渲染了我创建的局部视图：

        <div class="container" id="Things">
            <partial name="_CreateThingPartial" for="Things[0]" />
        </div>

这呈现得很好。

我想通过单击按钮在该容器中附加相同局部视图的另一个渲染。这是我当前的 jQuery：

var y = 0;

    $('#addThing').click(function () {
        y = y + 1;
        var newDiv = '<partial name="_CreateThingPartial" for="Things[' + y + ']" />';
        $('#Things').append(newDiv);
    });

但是有了这个，点击按钮什么也没做，我不知道为什么。

如果我只是在视图中添加该 html 行，如下所示：

        <div class="container" id="Things">
            <partial name="_CreateThingPartial" for="Things[0]" />
            <partial name="_CreateThingPartial" for="Things[1]" />
        </div>

那渲染得很好。

如果我像这样设置 newDiv：

var newDiv = '<input type="button" value=' + y + ' />';

这很好用！

所以这似乎只是通过 jQuery 使用局部视图的问题。

贝恩

`<partial>`不是 HTML 标签。它是一个由 .NET Core 定义的服务器端标签助手。

考虑您的Things实体。它存储在数据库中。除非您呈现 .cshtml 文件中的所有实体，否则您不能在客户端不向您的服务器发送额外请求的情况下将它们放置在客户端。

<partial>tag helper在服务器端渲染结果 HTML 标记时执行，而 jQuery在客户端（例如浏览器）执行。这就是为什么您不能简单地将<partial>jQuery放入内部并获取所需数据的原因。

可能的解决方案

以下代码片段向您展示了如何处理此问题的想法。直接复制粘贴是不行的。您必须了解这个概念并进行一些谷歌搜索才能使其发挥作用。

您可以在控制器中定义部分操作：

public ActionResult GetThingPartial (int id)
{
    /* get Thing[id] from database using EF Core */
    var videModel = Thing[id];
    return PartialView( "_CreateThingPartial", viewModel );
}

使用 jQuery 的 ajax 调用获取部分结果。

在您的 .cshtml 文件中：

var url = '@Url.Action("GetThingPartial", "YourControllerName")';

$.get(url, function(data) {
    /* append the data, which should be the partial HTML, to the corresponding <div> */
});

这篇文章也可能有助于解决你遇到的问题：https : //www.c-sharpcorner.com/uploadfile/manas1/sending-partialview-using-jquery-ajax-request-in-asp-net-mvc/

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。