MVC 6使用ajax将模型从视图传递到控制器到部分视图

Question

我想要做的是创建一个可以在所有不同视图中使用的gui对象。 我们的想法是通过将组件放入占位符div来将组件添加为主视图的局部视图。

这是我的模特

    public class Client
    {
        public int clientid { get; set; }
        public string clientname { get; set; }
    }

我用来插入组件的java脚本...理想情况下，我更喜欢使用通过直接调用传递给此视图的模型数据，但这不起作用，这就是为什么我一直在进行故障排除下面的var模型......

var model = {
    clientid: 23,
    clientname: "This one"
};
$.ajax({
    type: "POST",
    data: JSON.stringify(model),
    url: "../shared/ClientProgramSelector",
    contentType: "application/json"
}).done(function(result) {
    $("#clientProgramSelectorPlaceholder").html(result);
});

被调用的控制器在这里

[HttpPost]
public PartialViewResult ClientProgramSelector([FromBody] Client passingData )
{
    return PartialView("ClientProgramSelector", passingData);
}

最后，这是我试图将组件放入的div

<div id="#clientProgramSelectorPlaceholder"></div>

代码显示没有错误，但页面上没有任何内容呈现。 有谁看到我做错了什么？ 另外，有没有办法只使用传递的模型而不必重新创建数据？

提前致谢

Answer 1

您的ajax成功处理程序正在尝试将结果设置为$("#clientProgramSelectorPlaceholder")返回的jQuery元素。 这将返回Id值为“clientProgramSelectorPlaceholder”的元素。 但是你的HTML，你没有！ 你拥有的是一个带有"#clientProgramSelectorPlaceholder"的元素

你的div id应该没有# ，只要你的ajax调用返回200 OK响应它就应该工作。

<div id="clientProgramSelectorPlaceholder"></div>

如果要使用传递给主视图的模态数据渲染局部视图，可以调用Html.Partial方法，假设您的主视图也强类型为同一视图模型（ Client ）对象

@model Client 

<div id="clientProgramSelectorPlaceholder">
  @Html.Partial("ClientProgramSelector",Model)
</div>

如果要将原始模型作为ajax post数据传递，可以在javascript代码块中使用JsonConvert.SerializeObject方法。

var model = @Html.Raw(JsonConvert.SerializeObject(Model));
$.ajax({
    type: "POST",
    data: JSON.stringify(model),
    url: "@Url.Action("ClientProgramSelector","YourControllerNameHere")",
    contentType: "application/json"
}).done(function(result) {
    $("#clientProgramSelectorPlaceholder").html(result);
});