如何在 MVC 3 中的隐藏对话框中提交字段答案

【问题标题】：How to submit a field inside a hidden dialog in MVC 3如何在 MVC 3 中的隐藏对话框中提交字段
【发布时间】：2011-11-19 13:01:09
【问题描述】：

我在强类型视图中有一个 MVC 3 表单，其中我需要提交的字段之一是在 jQuery 对话框内。我无法将此字段作为提交的 POST 参数的一部分。为什么哦为什么？

观点：

@model My.Models.DialogFieldModel
@{
    ViewBag.Title = "Index";
}

<script type="text/javascript">
    $(document).ready(function () {
        $('#aDialog').dialog({
            autoOpen: true,
            height: 250, width: 400,
            modal: true,
            buttons: {
                "Ok!": function () {
                    $(this).dialog("close");
                }
            }
        });

    });
</script>

<h2>Index</h2>

@using (Html.BeginForm("PostDialogField", "DialogField"))
{
    @Html.ValidationSummary(true)
    <fieldset>

        @Html.HiddenFor(m => m.ID)
        @Html.DisplayFor(m => m.message)

        <div id="aDialog">
            <h3>Fill in this message!</h3>
            <div class="editor-field">
                @Html.EditorFor(m => m.message)
            </div>
        </div>

        <p><input type="submit" value="Submit Message" /></p>

    </fieldset>
}

模型：

using System;

namespace My.Models
{
    public class DialogFieldModel
    {
        public int ID { get; set; }
        public String message { get; set; }

        public DialogFieldModel()
        {
            message = "Default";
        }
    }
}

控制器：

using System;
using System.Web;
using System.Web.Mvc;
using WellTrkd.Models;

namespace My.Controllers
{
    public class DialogFieldController : Controller
    {
        public ActionResult Index()
        {
            DialogFieldModel dfm = new DialogFieldModel(); // set default message
            return View(dfm);
        }

        [HttpPost]
        public ActionResult PostDialogField(DialogFieldModel dfm)
        {
            String message = dfm.message;
            if (message != "Default")
                //Yay!
                return RedirectToAction("Index");
            else // Boo
                return RedirectToAction("Index");
        }

    }
}

不幸的是，#message 字段永远不会与其他 HTML POST 参数一起提交（在 chrome 开发视图的网络选项卡中检查），除非我将其从对话框中取出。结果是 PostDialogField 操作中 dfm.message 包含“默认”字符串，即使我已更改对话框中的消息。

我知道我可以在表单中添加一个隐藏字段，该字段与对话框中的字段保持同步，但我觉得我遗漏了一些东西。有什么想法哦，聪明的人？

【问题讨论】：

消息字段是什么类型的？一个布尔值？
如果您使用强类型视图，您确定 ID 已填充，因为这听起来像是一个创建视图，而当您插入新记录时，ID 将为空
@Dallas 我编辑了我的问题以指定消息字段是相应模型中的字符串。理想情况下，我想将该字段标记为 Datatype.MultilineText 并将其显示为 textarea。
不使用javascript提交表单并正常提交会怎样？
@DanielGill，请展示一个完整的例子来说明问题。缩小并删除所有不必要的部分，但保留必需品。目前，您描述的情况对我来说是不可复制的状态。所以：模型、控制器、视图、脚本允许复制它。显然，您将硬编码模型中的所有值，以便更容易重现，而无需设置数据库和其他东西。

标签： c# jquery asp.net-mvc-3

【解决方案1】：

您的问题是您变成对话框的元素被移出表单，移向 DOM 底部的新对话框元素。并且由于它不再是表单的一部分，因此在提交表单时也不会提交。

如果您在关闭对话框时将其销毁，它将被移回原来的位置，但我看不出这是否是所需的。另一种选择是同步元素。

【讨论】：

你是对的，对话框已移出表单，不知道我之前是如何错过的 :) 在“OK！”中使用 $(this).dialog("destroy") 销毁它按钮不会将其移回表单内。我猜同步隐藏字段是唯一的选择？