javascript - 在使用javascript的过程中提醒对话

使用ASP .Net MVC 4.0，vs10，MSSQL 2008

我有一个存储过程，该过程在我的页面之一中执行。通常需要30到50秒才能执行。我想显示一个警报对话框，在此过程中将加载gif图像。我正在使用sqlcommand执行存储过程。该过程开始于单击“过程”按钮。完成该过程后，页面将返回另一个视图。

我不太了解javascript，因此请向我展示一种简单的方法。

编辑：

是否可以在buttonclick上显示图像，然后执行其他代码隐藏过程？

喜欢：

<script type="text/javascript">
    function showImage() {
        document.getElementById('Processing').style.visibility = visible;
    }
</script>

<div id="progessbar">
     <img alt="Processing" src="../../Images/Processing2.gif" id="Processing" style="visibility:hidden"/>
</div>

最佳答案

由于请求需要很长时间，因此很难以传统的MVC方式完成您要执行的操作。使用异步处理您的请求的AJAX可以更好地实现这一点。我建议也使用jQueryUI对话框或任何模式来显示进度指示器，甚至任何自定义JS。

我个人喜欢jQuery BlockUI为我创建模式，但这只是一个偏爱。

/** Using a wrapper to show/hide the progress indicator.
    Swap the blockUI with any library or custom JavaScript for displaying the progress indicator.
 */
var showProgress = function() {
    $.blockUI({ message: '<img src="progressImage.gif" />' });
};

var hideProgress = function() {
    $.unblockUI();
;}

/** Trigger to submit the form */
$('#submit').click(function() {
    /** Show an indicator before making an AJAX request*/
    showProgress();
    $.ajax({
        url: '/someEndpoint',
        data: $.toJSON({/* some JSON param */}),
        type: 'POST',
        dataType: 'json',
        timeout: 50000 /** Override timeout in ms accordingly */

    }).done(function(data){
        /** Remove the indicator once the request has succeeded and process returned data if any. */
        hideProgress();
    });
    return false;
});