【问题标题】:Edit Model - Is there any better way?编辑模型 - 有没有更好的方法?
【发布时间】:2014-09-17 10:46:19
【问题描述】:

我的表单上有一个 WebGrid,其中一列的 ActionLink 为:

Html.ActionLink((string)item.Name, "Edit", new { id = item.Id })

以下代码的目的是将编辑屏幕显示为模态弹出窗口并成功发布更新的对象。

控制器 - 获取:

public ActionResult Edit(int id)
{
    ... //Fetch employeeViewModel @id
    TempData["StateData"] = employeeViewModel ;
    TempData["ViewState"] = "Edit";

    return RedirectToAction("Index");
}

Index.cshtml:

@if (TempData.ContainsKey("ViewState") && TempData["ViewState"].ToString() == "Edit")
{
    EmployeeViewModel employeeViewModel = (employeeViewModel)TempData["StateData"];
    @Html.Partial("_EditEmployee", employeeViewModel)

    <script language="javascript">
        $(window).load(function() {
            $('#editEmployeeModal').modal('show');
        });
    </script>
}

编辑表格:

<div class="modal fade" id="editEmployeeModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
...

使用完整的 Get/Post 模型进行编辑,所有这些都可以正常工作。 但是,我担心我在 Controller-Get 方法中进行的额外行程:

return RedirectToAction("Index");

谁能指导一下更好的方法?

谢谢!

【问题讨论】:

    标签: asp.net-mvc-5


    【解决方案1】:

    只是一个通用的指针:你不需要去服务器在浏览器中弹出一个模态对话框。您可以仅在 javascript 中执行此操作。一些常见的 javascript 库已经具有模态弹出窗口,您可以使用/自定义/借用等来满足您的需求。只需谷歌“javascript弹出表单”即可获取大量信息。

    【讨论】:

    • 感谢史蒂夫,但我的代码不是使用 js 加载模式弹出窗口吗 - $('#editEmployeeModal').modal('show');我只是想知道如何从控制器编辑操作返回,这样我就不必调用 - return RedirectToAction("Index");
    【解决方案2】:

    以下代码的目的是将编辑屏幕显示为模态弹出窗口并成功发布更新的对象。

    在直接回答你的问题之前,我想先谈谈这个问题。您需要确保模态是正确的选择。您需要保留一些状态吗?模态是否提供更好的用户体验?该模式是否可以跨平台使用旧技术?

    使用模式几乎总是比简单地重定向到另一个页面然后返回更复杂。权衡额外的复杂性与用户体验。如果不合理,那就放弃吧。还要想想你最终可能遇到的奇怪情况。当您的 modal 需要打开另一个 modal 时会发生什么?

    现在真正的问题是......如何让它发挥作用。简而言之,使用 AJAX。

    @Html.ActionLink((string)item.Name, "Edit", new { id = item.Id })
    

    打开模态框。模式包含一个 AJAX 表单元素 (Ajax.BeginForm()) 并将其发布到您的编辑操作。

    现在没有重定向。当操作完成时,通过 Ajax 表单的 AjaxOptions 执行一个 javascript 函数设置,该函数关闭模式(或显示验证)。用户在整个过程中从不离开页面。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-06-27
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-11-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多