Question

我使用MVC架构开发了一个Web应用程序。我的控制器需要一些时间来处理输入，将其发送到服务器并将其返回到视图。我希望在ActionResult返回视图时自动显示加载/请等待类型的弹出窗口并退出。我的控制器中的相应部分如下所示：

[HttpPost][STAThread]
    public ActionResult Index(DropDownModel model)
    {

        BillingToolInterface_1.Program p = new BillingToolInterface_1.Program(state, billtype, recurring, budget, paytype, IA, spanish, veteran, status, LDC, rate, adjustments, billtemplate, readtype, server1, server2, choice, paramcheck);

         //above step takes like 15 seconds to put the server result in       
//DataJoin.Connector.data. I want a dialog to be displayed during this time. 




        model.Message = DataJoin.Connector.data; 


        return View(model);
    }

Answer 1

您可以使用以下内容提交表单：

@using (Ajax.BeginForm("Index", "Controller", null, new AjaxOptions {HttpMethod = "POST", LoadingElementId = "please-wait"}, new {-- some html if needed --}))

这将显示请等待消息，直到回调结束。请等待可能是一些标记：

<div id="please-wait" style="display: none;">
    <div class="modal"></div>
    <div class="spinner">Loading...</div>
</div>

该标记的CSS可能是（不是最好的CSS而是有效）：

#please-wait
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

    #please-wait .modal
    {
        z-index: 1999;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: 0.5;
        -moz-opacity: 0.5;
        background-color: black;
        margin-left: 0;
    }

    #please-wait .spinner
    {
        z-index: 2000;
        padding-top: 20px;
        padding-left: 20px;
        background: #E5E5E5 url("loading.gif") no-repeat 15px center;
        width: 120px;
        height: 40px;
        border: 2px solid #666;
        font-weight: bold;
        text-align: center;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        top: 35%;
        display: block;
    }

在MVC视图中加载/请等待弹出窗口

1 个答案: