通过 JSONResult 将数据从控制器传递到视图

Question

我想将 ViewModel 从控制器发送到 JSON 格式的视图。

控制器：

public ActionResult Select(int pageLimiter)
{
    var viewModel = new ArticlesViewModel
                            {
                                Articles = this.Service.GetArticles(0, 0, 0),
                                ArticlesTotal = this.Service.CountArticles(0),
                                Pages = new List<string>
                                            {
                                                "1", "2", "3"
                                            }
                            };
    return Json(viewModel, JsonRequestBehavior.AllowGet);
}

查看：

<ul class="articleList">
@if (@Model != null)
{
    foreach (var article in @Model.Articles)
    {
        <li>
            <header><a href="/Article/@article.ArticleId">@article.Title</a></header>
            <nav>
                <span>@article.AuthorName</span> | 
                <time>@article.PublishDate.ToString("")</time> | 
                <span><a href="/Articles/@article.CategoryId">@article.CategoryName</a></span> | 
                <span>@article.Comments Comments</span>
            </nav>
            <section>
                @article.Content
            </section>
        </li>
    }
}
</ul>

<script type="text/javascript">
$(document).ready(function () {
    GetArticles(5);

    $("#selectPager").change(function () {
        var selectedItem = "";
        $("#selectPager option:selected").each(function () {
            selectedItem = $(this).text();
        });

        GetArticles(selectedItem);
    });
});

function GetArticles(pageLimitValue) {
    $.ajax(
    {
        url: "/Articles/Select",
        dataType: "json",
        data: { pageLimiter: pageLimitValue },
        async: true,
        beforeSend: function () {
            alert("before");
        },
        complete: function (data) {
            @Model = SOME_MAGIC_TRICKS
        }
    });
}

如您所见，完整的事件中有 SOME_MAGIC_TRICKS 字样。在这个地方我想设置从控制器获得的@Model。有可能吗？如何将ajax结果中的数据插入视图模型（默认为null）？

Answer 1

您正在尝试从客户端代码修改服务器变量。这是不可能的。

如果您想在complete 上重新呈现您的页面内容，您可以使用PartialView 呈现<ul class="articleList"> 并返回相同的局部视图而不是JsonResult。此外，oncomplete 处理程序将使用返回的内容更新您的 <ul class="articleList">。

Answer 2

你可以发送数据做序列化它可能是这样的：

public ActionResult Select(int pageLimiter)
{
    var viewModel = new ArticlesViewModel
                            {
                                Articles = this.Service.GetArticles(0, 0, 0),
                                ArticlesTotal = this.Service.CountArticles(0),
                                Pages = new List<string>
                                            {
                                                "1", "2", "3"
                                            }
                            };

    string myjsonmodel = new JavaScriptSerializer().Serialize(viewModel );
    return Json(jsonmodel = viewModel, JsonRequestBehavior.AllowGet);
}

不要忘记使用使用 System.Web.Script.Serialization；

编辑：

要反序列化对象试试这个：

@{
 JavaScriptSerializer jss= new JavaScriptSerializer();
 User user = jss.Deserialize<User>(jsonResponse); 
}