在按钮单击功能运行时禁用按钮或光标等待图标

Question

我有一个加载和运行 SSIS 包的按钮点击功能

<asp:Button ID="btnDoSomething" runat="server" Text="TEST run SSIS" 
    OnClientClick="return confirm('TEST-TEST-TEST')" 
    OnClick="btnDoSomething_Click" />

在单击功能中，我尝试将光标设置为等待，将标签设置为等待消息，甚至禁用单击的按钮——但是，似乎什么也没有发生……我在功能仅在功能（加载和运行 SSIS 包）完成后发生。

我不知道我真的很关心如何让最终用户知道该过程是运行（在 IE 之外，选项卡图标是一个旋转的球 "waiting for ..." 消息）

提前致谢（是的，我搜索了又搜索又试了又试...我敢打赌我漏掉了一些愚蠢的东西）

    protected void btnDoSomething_Click(object sender, EventArgs e)
    {
        Application app;
        DTSExecResult pkgResults;
        Package pckg;
        Variables vars;

        string SSISPackagePath = @"c:\test.dtsx";

        lblTEST.Text = "please wait ...";
        btnDoSomething.Enabled = false;

        try
        {
            app = new Application();
            pckg = app.LoadPackage(SSISPackagePath, null);
            vars = pckg.Variables;
            vars["PACKAGE_NAME"].Value = "test";

            pkgResults = pckg.Execute(null, vars, null, null, null);

            if (pkgResults == DTSExecResult.Success)
                lblTEST.Text = "shebang - it worked! (" + pkgResults.ToString() + ")";
            else
                lblTEST.Text = "something not good happened... (" + pkgResults.ToString() + ")";
            grdTest.DataBind();
        }
        catch (Exception ex)
        {
            lblTEST.Text = "ERROR: " + ex.Message.ToString();
        }

        btnDoSomething.Enabled = true;
    }

更新：感谢您的帮助！！

因为我需要确认我添加了一个简单的脚本

    function getConfirm() {
        if (confirm("Are you sure you want to generate letters for all RELEASED campaigns?")) {
            showOverlay();
            return true;
        }
        else return false;
    }

并更改了 onClientClick 来调用它 OnClientClick="return getConfirm();"

对于 IE 我也添加了

filter: alpha(opacity = 40);

到 css 这样它会正确显示不透明度。

喜欢叠加层..谢谢！！ :)

Answer 1

选项 1：禁用按钮

定义一个javascript函数，如下。您必须 return true 否则您的服务器事件将不会触发：

function disabledMe(btn) {
    btn.disabled = "disabled";
    return true;
}

然后，像这样使用它：

<asp:Button ID="btnDoSomething" runat="server" Text="TEST run SSIS" 
   OnClientClick="disabledMe(this);"
   OnClick="btnDoSomething_Click" />

选项 2：使用叠加层

在我看来，这种技术更好，因为它会在服务器事件运行时阻止与页面的任何交互。

创建一个 div，其样式将用作叠加层：

<div id="overlay" class="overlay"></div>

这个 CSS class 可以解决问题：

<style type="text/css">
    .overlay {
        background-color: #000;
        cursor: wait;
        display: none;
        height: 100%;
        left: 0;
        opacity: 0.4;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 9999998;
    }
</style>

并且您需要使用 javascript 来控制叠加可见性：

<script>
    function showOverlay() {
        document.getElementById("overlay").style.display = "block";     
    }

    function hideOverlay() {
        document.getElementById("overlay").style.display = "none";
    }
</script>

在客户端单击按钮时使用 showOverlay 函数：

<asp:Button ID="btnDoAnythingElse" runat="server"
            Text="TEST run SSIS" OnClientClick="showOverlay();"
            OnClick="btnDoAnythingElse_Click" />

并且在服务器事件结束时，注册一个脚本来调用隐藏叠加层的函数：

protected void btnDoAnythingElse_Click(object sender, EventArgs e)
{
    Thread.Sleep(2000); // simulates a long running process
    ClientScript.RegisterStartupScript(this.GetType(), "hideOverlay", "hideOverlay();", true);
}

在按钮单击功能运行时禁用按钮或光标等待图标

disable button or cursor wait icon while button click function runs

c#

asp.net

ssis