Jquery 排序或分页ASP.net MVC Webgrid时显示Ajax加载指示器

我可以轻松地连接webgrid，并使用默认设置向其中添加ajax。但我一直在努力弄清楚的一件事是，当网格通过ajax进行排序或分页时，如何添加加载指示器

有一个内置的回调函数，可以很好地关闭ajax加载指示器，但是如何轻松地打开它呢

下面是我目前为webgrid编写的代码

@{
    var grid = new WebGrid(rowsPerPage: Model.CountPerPage, ajaxUpdateContainerId: "GridArea");
    grid.Bind(Model.Users,
              autoSortAndPage: false,
              rowCount: Model.TotalCount
            );
    grid.Pager(WebGridPagerModes.All);
}
<div id="GridArea">
    @grid.GetHtml(htmlAttributes: new {id ="UserGrid"},
        columns: new [] {
        grid.Column("ID", canSort: false),
        grid.Column("FirstName"),
        grid.Column("LastName"),
        grid.Column("Email"),
        grid.Column("FullName", canSort: false)
        }
    )
</div>

@{
var grid=new WebGrid（rowsPerPage:Model.CountPerPage，ajaxUpdateContainerId:“GridArea”）；
grid.Bind（Model.Users，
autoSortAndPage:false，
rowCount:Model.TotalCount
);
Pager（WebGridPagerModes.All）；
}
@GetHtml（htmlAttributes:new{id=“UserGrid”}，
列：新[]{
grid.Column（“ID”，canSort:false），
网格栏（“名字”），
grid.Column（“LastName”），
表格栏（“电子邮件”），
grid.Column（“全名”，canSort:false）
}
)

我试过使用下面的方法，但都不起作用

<script>
    $(function () {
        $("#UserGrid").live("ajaxStart", function () {
            alert("start");
        });
    });
</script>

$（函数（）{
$（“#UserGrid”）.live（“ajaxStart”，函数（）{
警报（“启动”）；
});
});

这是第一次工作，但在网格进行第一次ajax刷新后就无法工作了

<script>
    $(function () {
        $('#UserGrid').ajaxStart(function () {
            alert("start");
        });
    });
</script>

$（函数（）{
$（'#UserGrid'）.ajaxStart（函数（）{
警报（“启动”）；
});
});

这应该行得通

$(document).ajaxStart(function(){
     //Show your progressbar here
}).ajaxStop(function(){
     //Hide your progressbar here
});

---

第二种方法不起作用，因为在第一个ajax响应之后，将重新创建DOM，并且.ajaxStart事件绑定将丢失。将它与全局文档对象绑定在一起，它将始终存在。

是的，上面的答案应该对您有所帮助。基本上有一个jQueryAPI，它将处理从客户端到服务器的任何ajax请求。因此，当您执行任何ajax操作时，它将调用触发器函数。

---

您可以将自定义css/图像或一些可以调用的函数作为ajax操作的指示符。

如果我想要页面的其他ajax驱动部分，并且需要直接将调用与Webgrid区分开来，我该如何实现这一点？每次Webgrid的DOM被ajax替换时，您都需要重新绑定Webgrid的ajax事件处理程序呼叫因此，无论您做什么，您都需要一些全局ajax处理程序，以便可以重新绑定所有这些处理程序。如果要区分调用，可以使用隐藏字段跟踪发起ajax调用的控件。如果需要页面的其他ajax驱动部分，并且需要直接将调用与Webgrid区分开来，如何实现这一点？