【问题标题】:MVC 3 post model and additional parameter to HttpPost action method using Ajax form使用 Ajax 表单的 MVC 3 发布模型和附加参数到 HttpPost 操作方法
【发布时间】:2012-08-09 04:34:51
【问题描述】:

使用 ASP.NET MVC 3 和 Razor,我有一个针对 MyViewModel 类的强类型视图。在视图中,我有一个由一组单选按钮组成的 AJAX 表单。在它下面,我有一个普通的 HTML 表单,用于收集 MyViewModel 的数据。根据在 AJAX 表单中选择了哪个单选按钮,我想用一组或另一组默认值更新 HTML 表单。在 AJAX 表单中,我尝试发布两条数据:1) 表示所选选项的值(基于单选按钮 value 参数),以及 2) 视图中的 Model。我希望控制器操作根据收到的选项更新模型,然后返回带有更新后的模型对象作为参数的局部视图。我该怎么做呢?这是我尝试的 AJAX 表单的代码:

@using (Ajax.BeginForm("MyAction", "MyController",
        new AjaxOptions {
            HttpMethod = "POST",
            InsertionMode = InsertionMode.Replace,
            UpdateTargetId = "createForm"
        })) 
{
    <div id="formOptions">
        @foreach (Option op in Model.GetOptions()) {
            <div class="editor-field">
            @Html.RadioButton("option", op.OptionType, false, new { @id = op.ID, @name = op.ID, @title = @op.Description, @onfocus = "javascript:$(this).closest('form').find(':submit').first().click()" })
            <label for="@op.ID">@op.Name</label>
            </div>
        }
    </div>
    @Html.Hidden("model", Model)
    <input type="submit" value="Select" style="display:none;" />
}

我的问题是 HttPost 操作方法中的model 参数为空。但是,option 参数似乎正确传递。我不确定我是否以不应该使用的方式使用Html.Hidden 输入或问题是什么。如果需要,我可以发布更多代码。

这是我第一次尝试做这样的事情,所以在阅读了很多(看似)类似的问题之后,我仍然无法破译我想做的解决方案。我看到了很多不同的东西,比如 JSON 编码、使用 JQuery 等,但我不确定我是否需要这些东西,或者我是否可以使用 MVC 功能来完成这个(我宁愿不重新编码已经存在的东西)内置在 MVC 3) 中。如果有人能指出我正确的方向或可能给出一个小代码示例,将不胜感激。而且,考虑到我的最终目标是,如果有更好的方法来基于选项控件异步更新表单,我会非常有兴趣听到它。谢谢!

编辑:

我还注意到使用 HttpPost 的请求不会到达控制器,但 HttpGet 会。外面有人吗?这让我发疯了!

添加控制器方法:

public PartialViewResult CreateForm(OptionType opType, MyViewModel model) {
    model.ApplyOptionValues(opType);
    return PartialView("_CreateForm", model);
}

【问题讨论】:

  • 您可以添加您要发布的方法签名吗?

标签: ajax asp.net-mvc razor asp.net-ajax


【解决方案1】:

我不会将整个模型发布回您尝试使用@Html.Hidden("model", Model) 进行的控制器,只需将您需要的特定项目放入表单中,其名称/类型与您的控制器匹配。您可以使用所选单选按钮的值以及隐藏输入的值将识别信息传递给控制器​​并在那里执行您需要的任何逻辑。

话虽如此,我认为未来最好的解决方案是使用一些 JavaScript 框架(如 JQuery)来处理所有 AJAX 请求。 Asp.net MVC 使得使用内置部件进行简单操作变得非常容易,但是一旦您需要执行更复杂的操作,它肯定会失败。与仅使用正确的工具 (JQuery) 相比,您最终会在限制范围内付出更多努力。

确保使用 [HttpPost] 注释您的 POST 操作方法以区别于 GET 方法。

还可以使用详细的网络调试器来准确检查发送到您的应用程序的内容。我喜欢 Fiddler,它非常受欢迎。 http://www.fiddler2.com/fiddler2/

【讨论】:

  • 感谢 JQuery 的建议。我在其他地方读过类似的 cmets,所以我可能会走那条路。
【解决方案2】:

我同意 Mattbo 的观点:将整个模型围成一圈发布是不必要的开销。你没有说你为什么是,但我怀疑这是为了让你可以比较“旧”和“新”值。鉴于模型源自控制器,您可以在 ViewModel 中包含模型的唯一标识符(例如 GUID),将其放在隐藏字段中以包含在您的 POST 数据中,然后在返回 POST 时,您的“新”数据将是自动映射到强类型 ViewModel。然后,您可以重新获取原始模型并对它们进行任何您需要的操作。

处理 AJAX 表单是一个单独的问题/表单:您的单选按钮填写(视图模型)表单中的默认值(包括一个隐藏字段以记录选择了哪个单选),用户填写其他数据和整个(非 ajax)表单被发布到 MyController.MyAction 方法,默认绑定器将自动将表单值映射到 MyViewModel,如果它们遵循正确的命名约定。所以 AJAX 与实际发布的表单无关。或者,您可以按照 Mattbo 的建议使用 AJAX 完成所有工作。

[Aside] 如果您已经知道,请原谅我,但您可以使用 razor Html 助手来创建您的字段,例如:

@Html.EditorForModel()
@Html.EditorFor(model => model.[field name])

在控制器中,您将创建如下操作: 公共 ActionResult MyAction() { 我的视图模型 }

[HttpPost]
public ActionResult MyAction(MyViewModel myModel)

【讨论】:

  • 关于发布整个模型,原因是模型包含一些不受所选选项影响的属性。因此,如果用户为那些未受影响的字段输入数据,然后选择了不同的选项,则刷新的表单(使用全新的模型)将替换应该与默认值选择的选项无关的数据,用户将不得不重新输入该数据。这有意义吗?
猜你喜欢
  • 2012-08-15
  • 2013-07-25
  • 2019-01-26
  • 1970-01-01
  • 2012-06-03
  • 2012-04-09
  • 2016-05-28
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多