1

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

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

我对javascript知之甚少，所以请告诉我一个简单的方法。

编辑：

是否可以在按钮单击上显示图像并执行其他代码隐藏过程？

喜欢：

<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>
4

2 回答 2

0

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;
});
于 2013-01-28T08:27:13.007 回答
0

用于ajax您的过程。它将为“显示 gif”和完成您想要的代码进行并行处理。您可以通过JQuery-AJAX这种方式使用页面方法：[1]：http ://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/

成功回调包含一个带有返回数据的参数。

或者你可以简单地试试这个

var actionURL = "(Your disired action e.g /index.jsp)"
$.ajax({
cache:false,
url: actionURL,
beforeSend: function( xhr ) {
    xhr.overrideMimeType( 'text/plain; charset=UTF-8' );
    $("#progessbar").show();
    //Here you can write any code to execute before the action like gif loading etc
},
success: function( data ) {
    alert("Success Conditions");
    //"data" is what u gets from your target. You can see by alert(data); here
    //Here you can write any code which you want to execute on finding the required action successfully
},
complete: function(){
    alert("Complete Conditions");
    $("#progessbar").hide();
    //Here you can write any code which you want to execute on completion of the required action you given in actionURL
},
error: function(){  
    alert("Error Conditions");
}
});

注意：警报仅用于解释，您也可以编写自己的代码对于此代码，您必须包含jquery插件。可以从他们的官方网站[l]下载：http: //jquery.com/

于 2013-01-28T08:44:28.020 回答