Question

我无法发布JSON的结果，因此将成功部分留空了。

查看

@model MvcApplication2.Models.About

@{
    ViewBag.Title = "About";
}


<p> @Html.DisplayFor(m=>m.test) </p>
<p> @Html.DisplayFor(m=>m.test1) </p>

模型

public class About
    {
        public string test { get; set; }
        public string test1 { get; set; }
    }

控制器

public class HomeController : Controller
    {
       public JsonResult About()
        {
            ViewBag.Message = "Your app description page.";
            About ab = new About()
                              {
                                  test = "a",
                                  test1 = "b"
                              };
            return Json(ab, JsonRequestBehavior.AllowGet);
        }
}

外部文件中的JQuery

$(document).ready(function () {

    var itemName = "#btn-about";

    $(itemName).click(function () {
        $.ajax({
            type: 'GET',
            dataType: 'Json',
            url: '/Home/About',
            success: function (data) {
                var option = '';

            },
            error: function (xhr, ajaxOption, thorwnError) {
                console.log("Error")
            },
            processData: false,
            async: true
        });
    });
});

=＆GT;我现在有点困惑。尽管我使用AJAX得到JSON格式的结果，但我希望在此视图“关于”中发布它。 View已经定义了@model，所以一旦得到结果，我希望视图自动加载它，因为我认为它不是在Javascript中创建html控件的好选项。

=＆GT;是否有可能或者我必须逐一填写控制权。

=＆GT;我是MVC的新手，所以你能告诉我任何好的建议。

Answer 1

控制器：

public ActionResult About()
{
    var model = repo.GetModel();
    return PartialViewResult("about", model);
}

jQuery的：

$.ajax("/Controller/About/", {
    type: "GET",
    success: function (view) {
        $("#aboutDiv").html(view);
    }
});

在主视图中：

<div id="aboutDiv"><div>

Answer 2

您需要为元素提供一些id或类，以便您在客户端上轻松地与它们进行交互。然后，当您收到响应时，从JSON数据中获取值并使用新值更新元素（使用id / class查找它）。我假设您没有为您的字符串定义任何特殊模板，如果您这样做，请根据需要调整代码中的选择器。

查看

<p class="testDisplay"> @Html.DisplayFor(m=>m.test) </p>
<p class="test1Display"> @Html.DisplayFor(m=>m.test1) </p>

客户端代码

$(document).ready(function () {

    var itemName = "#btn-about";

    $(itemName).click(function () {
        $.ajax({
            type: 'GET',
            dataType: 'Json',
            url: '/Home/About',
            success: function (data) {
                $('.testDisplay').html(data.test);
                $('.test1Display').html(data.test1);
            },
            error: function (xhr, ajaxOption, thorwnError) {
                console.log("Error")
            },
            processData: false,
            async: true
        });
    });
});

Answer 3

您不必返回数据，而是必须将视图作为字符串返回，并使用jquery来替换结果。

控制器：

    public JsonResult About()
    {
        var model = // Your Model
        return Json((RenderRazorViewToString("ViewNameYouWantToReturn", model)), JsonRequestBehavior.AllowGet);
    }

    [NonAction]
    public string RenderRazorViewToString(string viewName, object model)
    {
        ViewData.Model = model;
        using (var sw = new StringWriter())
        {
            var viewResult = ViewEngines.Engines.FindPartialView(ControllerContext, viewName);
            var viewContext = new ViewContext(ControllerContext, viewResult.View, ViewData, TempData, sw);
            viewResult.View.Render(viewContext, sw);
            viewResult.ViewEngine.ReleaseView(ControllerContext, viewResult.View);
            return sw.GetStringBuilder().ToString();
        }
    }

然后使用jquery，您可以将容器中的结果替换为例如：div，如下所示：

    $.ajax({
        type: 'GET',
        dataType: 'Json',
        url: '/Home/About',
        success: function (result) {
             $("#divId").replaceWith(result);
        },

MVC：来自JSON的结果自动填充视图

3 个答案: