如何在 Razor MVC3 中的表单提交操作返回时更改 div 的样式？

Question

我有一个带有表单和提交按钮的 Razor/ASP/MVC3 Web 应用程序，它会在服务器上执行一些操作，然后再发回表单。通常会有一些延迟，重要的是用户知道他们应该在关闭页面或在网站上做其他事情之前等待它完成并确认，因为似乎用户正在这样做，有时他们的工作还没有被处理假设它有。

所以，我在一个隐藏的 Div 中添加了一个“正在保存，请稍候...”微调器，当他们按下提交按钮时，该微调器变得可见，效果非常好，但我无法找到一种方法来获取操作完成后，Div 会重新隐藏。

我的微调器 Div 是：

<div id="hahuloading" runat="server">
  <div id="hahuloadingcontent">
    <p id="hahuloadingspinner">
        Saving, Please Wait...<br />
        <img src="../../Content/Images/progSpin.gif" />
    </p>
  </div>
</div>

它的 CSS 是：

#hahuloading
{
    display:none;
    background:rgba(255,255,255,0.8);
    z-index:1000;
}

我让“请稍候”微调器出现在可见按钮的 JS 方法中，它像这样调用实际的提交按钮：

    $(document).ready(function () {
        $("#submitVisibleButton").click(function () {
            $(this).prop('disabled', true);
            $("#myUserMessage").html("Saving...");
            $("#myUserMessage").show();
            $("#hahuloading").show();
            document.getElementById("submitHiddenButton").click();
        });
    });

我的视图模型代码被调用、执行操作并返回一个字符串，该字符串设置了显示正常的用户消息内容，但是当我尝试在示例中执行一些代码时，我看到了：

        // Re-hide the spinner:
        Response.write (hahuloading.Attributes.Add("style", "visibility:hiddden"));

它告诉我“当前上下文中不存在 hahuloading”。 是否有某种方法我应该在视图模型中定义一个变量，该变量将对应于 Div，以便我可以从服务器的操作处理程序中设置它的可见性？ 或者，我可以让 div 显示以某个值为条件，以在页面从操作返回时起作用吗？ 或者，无论如何，谁能帮我弄清楚如何在服务器操作完成后重新隐藏我的 div？

谢谢！

Answer 1

这是用 ajax 完成的吗？我会假设是因为页面没有被重定向。试试这个：

$(document).ready(function () {
    $("#submitVisibleButton").click(function () {
        $(this).prop('disabled', true);
        $("#myUserMessage").html("Saving...");
        $("#myUserMessage").show();
        $("#hahuloading").show();
        document.getElementById("submitHiddenButton").click();
    });
    $("#hahuloading").ajaxStop(function () {
     $(this).hide();
    });
});

顺便说一句，您不再需要runat=server。