将复杂的字典发布到控制器答案

【问题标题】：POSTing a complex Dictionary to Controller将复杂的字典发布到控制器
【发布时间】：2016-11-10 23:43:46
【问题描述】：

我正在尝试将以下类型发布到我的控制器。

型号

public class EmailNotificationSettings
{
    public string EmailHost { get; set; }
    public string EmailPassword { get; set; }
    public int EmailPort { get; set; }
    public string EmailSender { get; set; }
    public string EmailUsername { get; set; }
    public bool Enabled { get; set; }
    public bool EnableUserEmailNotifications { get; set; }
    public string RecipientEmail { get; set; }
    public Dictionary<NotificationType, NotificationMessageContent> Message { get; set; }
}

通知类型

public enum NotificationType
{
    NewRequest,
    Issue,
    RequestAvailable,
    RequestApproved,
    AdminNote,
    Test,
}

NotificationMessageContent

public class NotificationMessageContent
{
    public string Subject { get; set; }
    public string Body { get; set; }
}

现在除了Message 之外，所有属性都是我表单的一部分。这是我打算如何填充Message

查看

<label for="newRequestSubject" class="control-label">New Request Subject</label>
<div>
    <input type="text" class="form-control form-control-custom " id="newRequestSubject" name="newRequestSubject" value="@Model.Message.FirstOrDefault(x => x.Key == NotificationType.NewRequest).Value.Subject">
</div>

<label for="newRequestBody" class="control-label">New Request Body</label>
<div>
    <input type="text" class="form-control form-control-custom " id="newRequestBody" name="newRequestBody" value="@Model.Message.FirstOrDefault(x => x.Key == NotificationType.NewRequest).Value.Body">
</div>

Javascript 发布

 $('#save').click(function (e) {
        e.preventDefault();

        var newRequestObj = {
            "Subject": $('#newRequestSubject').val(),
            "Body": $('#newRequestBody').val()
        };
        var message = { 'NewRequest': JSON.stringify(newRequestObj) };

        var $form = $("#mainForm");
        var data = $form.serialize();

        data = data + "&" +JSON.stringify(message);

        $.ajax({
            type: $form.prop("method"),
            data: data,
            url: $form.prop("action"),
            dataType: "json",
            success: function (response) {
               // Do something
            }
        });
    });

现在这显然是错误的做法，因为我的 Message 属性没有被填充。

知道如何 POST 到控制器并更新我的模型吗？

如果您想查看控制器（使用 NancyFX）

private Response SaveEmailNotifications()
{
    var settings = this.Bind<EmailNotificationSettings>();
    // settings.Message doesn't contain the new values
}

【问题讨论】：

虽然有可能（您需要为Dictionary 的Key 和Value 属性生成表单元素（请参阅this article），但您会发现使用视图要容易得多具有IList 或IEnumerable 属性的模型。并且始终使用强类型HtmlHelper 方法来生成表单控件。您当前生成的名称属性与您的模型完全没有关系
@StephenMuecke 是的，我理解我的问题，即 html 与我的模型无关。你有一个HtmlHelper 的例子吗？或者指出我正确的方向？
您似乎只使用FirstOrDefault() 来获取字典中的第一项，所以不清楚您为什么需要字典？根据您显示的所有视图模型需求的代码是public NotificationType NotificationType { get; set; } 和public NotificationMessageContent NotificationMessageContent { get; set; }，然后是@Html.TextBoxFor(m => m.NotificationType) 和@Html.TextBoxFor(m => m.NotificationMessageContent.Subject) 和@Html.TextBoxFor(m => m.NotificationMessageContent.Body)（所有内容都将使用var data = $form.serialize(); 进行序列化
@StephenMuecke 抱歉造成误解。 FirstOrDefault() 只是我试图让某些东西正常工作，字典包含 5 个项目（并且只有 5 个项目），每个项目在表单中都有自己的部分，这就是为什么它不适合将其拆分为两个属性
那你需要查看模型。假设class Notification 具有属性NotificationType Type、字符串主题和string Body，然后EmailNotificationSettings 包含属性List<Notification> Messages，您使用for 循环来生成表单控件。

标签： javascript c# jquery asp.net-mvc nancy

【解决方案1】：

我想不出一种方法让它与纯 HTML 一起工作。问题是您需要提交一个包含数据的名称为“Message”的控件，然后 MVC 映射引擎将该控件映射到模型的“Message”属性。

我能想到的最好方法是使用 JavaScript 函数（绑定到表单的 onsubmit 事件），它将信息作为对象数组收集并将其分配给一个名为“Message”的变量，然后将其序列化与其余的表单数据并提交表单。

【讨论】：