如何通过 PartialView 的 AJAX 调用显示视图？答案

【问题标题】：How can I displaying view with AJAX call from PartialView?如何通过 PartialView 的 AJAX 调用显示视图？
【发布时间】：2018-11-04 19:36:52
【问题描述】：

我正在使用 PartialView，我正在部分显示 3 条新闻。我正在将消息 ID 从部分视图发送到我的操作结果。当用户点击时，他们可以阅读被点击的新闻。我的 ajax 调用返回所有 HTML 数据。我很好，通常是这样，但我想获取数据库数据并显示我的操作结果。

NewsPartialView.cshtml

<script>
    $(document).ready(function () {
        $('.fright').click(function () {
            var id = $(this).attr('id');
            $.ajax(
                {
                    type: 'GET',
                    url: '/Content/NewsDetail/' + id,            


                    success: (function (data) {
                        alert("Okey");
                       console.log(data);

                    }),
                    error:function()
                    {

                        alert("Error");
                    }

                });

        });

    });
</script>

    @model IEnumerable<Models.Managers.News>
    .....
    <div class="news fright" id="@item.ID">Read New >></div>

新闻控制器

 public ActionResult NewsDetail(int id)
        {

            dbContext = new DbContext();

            var news = dbContext.News.First(x => x.ID == id);
            return View(news);

        }

【问题讨论】：

您需要为新闻详细信息创建另一个部分视图并通过调用操作从数据库中获取信息
@mbadeveloper 感谢您的回答。我可以用 JSON 制作吗？例如，我向 JsonResult 发送 ajax 调用。我可以将 JSON 数据传递给我的 NewsDetail 吗？
@mbadeveloper 我创建了部分视图，我将带有 ajax 的 id 发送到 NewsDetailPartial。我可以正确发送 id 但我的 NewsDetail 没有显示，我再次显示主页。
NewsDetail 没有显示，因为在您的 success 函数中，您必须对从 NewsDetail 端点返回的内容实际做一些事情。因此，您可以 1）编写一些 JS 将 HTML 插入页面中的某个位置（并使 NewsDetail 返回一个 PartialViewResult，以便它正常工作），或者 2）忘记使用 ajax，并使用创建一个正常的超链接，这将导致用户访问该视图并离开主页。

标签： jquery ajax asp.net-mvc asp.net-mvc-partialview

【解决方案1】：

您可以使用 window.location.href。你不需要 AJAX 调用。

【讨论】：

感谢您的回答。
$(document).ready(function () { $('.fright').click(function () { var id = $(this).attr('id'); 窗口。 location.href='/Content/NewsDetail'+id; alert("success"); }); });

【解决方案2】：

 $(document).ready(function () {
        $('.fright').click(function () {
var id = $(this).attr('id');
$.ajax({
         type: "GET",
        url: '/Content/NewsDetail',
        data: id,
        dataType: 'json',
        contentType: false,
        processData: false,
        success: function (data) {
        
        }
        error:function(data)
                    {

                        alert("Error");
                    }

    });
    });

    });

【讨论】：

这到底是为了说明什么？据我所知，它没有任何用处。它的格式也很糟糕，根本没有解释。我知道您是新用户 - 请注意此建议并提高您的回答质量。