ASP.NET MVC - 时间ajax请求

I'm using a jQuery modal dialog to display a 'Please Wait' type message to a user when a ajax call is made back to the server.

当ajax调用返回服务器时，我正在使用jQuery模式对话框向用户显示“Please Wait”类型消息。

I'm doing this by making the dialog visible using the jQuery ajaxSend method. And I close the dialog using the jQuery ajaxComplete method.

我这样做是通过使用jQuery ajaxSend方法使对话框可见。然后我使用jQuery ajaxComplete方法关闭对话框。

All fairly routine stuff I'm sure.

我确信所有相当常规的东西。

However if the call takes a very short about of time (say 10 milliseconds) then I want wait until a second has passed since making the dialog visible before I then close the dialog. The reason is to provide user feedback ... and to stop the horrible flicker of the dialog quickly opening and then closing.

但是，如果调用时间非常短（比如10毫秒），那么我想等到一秒钟过去，因为在我关闭对话框之前使对话框可见。原因是提供用户反馈......并停止快速打开然后关闭对话框的可怕闪烁。

How can I achieve this using jQuery and / or ajax?

如何使用jQuery和/或ajax实现这一目标？

Many thanks for any pointers.

非常感谢任何指针。

2 个解决方案

#1

Would a better paradigm be to actually wait for a period of time before showing the dialog? If you have a responsive app then it would make sense to only show the modal if the response does not come back within say 100ms. This would avoid delaying the UI just to avoid flicker which is what you are proposing.

更好的范例是在展示对话之前实际等待一段时间吗？如果您有一个响应式应用程序，那么仅在100分钟内响应未返回时才显示模态是有意义的。这样可以避免延迟UI，以避免闪烁，这是您提出的建议。

Note I am using beforesend and success here to dummy up the code

注意我在这里使用beforesend和success来编写代码

  var timerid;

  beforeSend: function(){

       //open the dialog in 100 milliseconds
       timerid = window.setTimeout( function(){

            $('#dialog').dialog('close');

       }, 100)

    },
  success: function(){

      //cancel the showing of the dialog if not already called
      window.clearTimeout( timerid );
      //close the dialog regardless
      $('#dialog').dialog('close');
  }

If you dont like this idea then simplay put the dialog close function inside a setTimeout within the ajax complete callback e.g

如果您不喜欢这个想法，那么simplay将对话框关闭函数放在ajax完全回调中的setTimeout中，例如

complete : function(){

   //close the dialog in 1 second
   window.setTimeout( function(){

        $('#dialog').dialog('close');

   }, 1000)

}

#2

I've pulled together a solution for this myself - based on the great response from 'redsquare' and some further reading.

我自己也为此解决了一个问题 - 基于'redsquare'的响应和一些进一步的阅读。

I have used the code from redsqure to open the modal dialog only after a given duration has passed - thus hopefully not having to open the modal at all.

我已经使用了redsqure中的代码，只有在给定的持续时间过后才打开模态对话框 - 因此希望根本不需要打开模态。

For when the modal has opened I've added code to ensure it remains open for a minimum of 800 milliseconds ... just to avoid the possibility of it quickly flashing up on the screen. To achieve this I start a javascript timer in the 'ajaxSend' method and then I use the 'ajaxComplete' method to determine whether the modal is open. If so I use the timer to calculate how long it has been open for and make up the difference to 800 milliseconds. I adapted a script I found on line for my timer. Script below.

当模态打开时，我添加了代码以确保它保持打开至少800毫秒......只是为了避免它在屏幕上快速闪烁的可能性。为了实现这一点，我在'ajaxSend'方法中启动了一个javascript计时器，然后我使用'ajaxComplete'方法来确定模态是否打开。如果是这样的话，我会使用计时器来计算打开的时间，并将差值补足到800毫秒。我改编了一个我在线找到的脚本用于我的计时器。下面的脚本。

var timer_ms = 0;
var timer_state = 0;

/// <summary>
/// Responsible for starting / stopping the timer. Also calculates time.
/// </summary>
function timerStartStop() {
    if (timer_state == 0) {
        timer_ms = 0;
        timer_state = 1;
        then = new Date();
        then.setTime(then.getTime() - timer_ms);
    }
    else {
        timer_state = 0;
        now = new Date();
        timer_ms = now.getTime() - then.getTime();
    }
}

/// <summary>
/// Resets the timer.
/// </summary>
function timerReset() {
    timer_state = 0;
    timer_ms = 0;
}

Thanks. Thanks.

谢谢。谢谢。

#1