Question

我试图学习如何使用我的Razor ajax形式使用pace.js。表单返回部分视图。根据他们的文档，不需要配置monitors all ajax requests（超过500毫秒）。我有以下ajax形式：

@using (Ajax.BeginForm("MyAction", null,
new AjaxOptions
{
    HttpMethod = "POST", // HttpPost
    InsertionMode = InsertionMode.Replace, 
    UpdateTargetId = "myDiv", 
    OnBegin = "myBeginFunction()",
    OnSuccess = "mySuccessFunction(data.msgType, data.msg)",
    OnFailure = "myFailFunction('Error', error)",
    OnComplete = "myCompleteFunction()"
}, new { @class = "form-inline" }))
{
   //...
}

在myBeginFunction()上我添加了Pace.restart()

function myBeginFunction()
{
   //...
   Pace.restart();
   //...
}

不幸的是，加载栏与表单不同步，因为加载栏在表单完成提交之前很久就完成了。我有两个问题

为了跟踪Razor ajax形式，我需要做些什么特别的事吗？
如果我需要手动跟踪表单，我该怎么办？根据{{3}}，我可以跟踪Pace.track(function(){ $.ajax(...)});，但我不确定如何使用剃须刀。

Answer 1

从你的ajax开始功能中删除pace.restart。将其添加到您的页面。

<script>
    paceOptions = {
        restartOnPushState: true,
        ajax: true,
        document: true,
        restartOnRequestAfter: true
    }
</script>

Answer 2

虽然我无法使用速度（由于配置的最小配置会很好）但我能够使用名为https://ipython.org/ipython-doc/3/config/extensions/autoreload.html的插件来解决问题。这基本上执行相同的行为，但不像NProgress那样自动执行DOM跟踪。因此，我必须手动启动和启动该功能。下面的JavaScript使用以下内容：

function myBeginFunction()
{
   //...
   NProgress.start();
   //...
}

function myCompleteFunction()
{
   //...
   NProgress.done();
   //...
}

由于NProgress如何工作的性质，在我致电NProgress.done();

之前，该栏会增加但从未完成

Answer 3

我遇到了同样的问题和following link did work for me

$(document).ajaxStart(function() { Pace.restart(); });

如何用pace.js跟踪razor ajax表单

3 个答案: