在排序或分頁時顯示Ajax加載指示器ASP.net MVC Webgrid

我可以輕鬆地連接webgrid並使用默認設置爲其添加ajax。但是我一直在努力研究的一件事是如何在網格通過ajax進行排序或分頁時添加加載指示符。在排序或分頁時顯示Ajax加載指示器ASP.net MVC Webgrid

有一個內置的回調函數，非常適合關閉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>

我試過使用以下，但這些都沒有奏效。

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

這是第一次工作，但不會在網格完成其第一次ajax刷新後工作。

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

來源

2012-10-22 Rob Carroll

這應該有效。

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

你的第二個方法是不是第一個Ajax響應後，因爲工作，重新創建DOM和.ajaxStart甚至綁定丟失。將它與全局文檔對象綁定在一起，它將一直存在。

來源

2012-10-22 03:09:07 Tariqulazam

如果我想要其他ajax驅動的頁面部分，並且我需要直接從Webgrid區分呼叫，該如何實現此目的？ –

每當webgrid的DOM被ajax調用替換時，您需要重新綁定webgrid的ajax事件處理程序。所以，不管你做什麼，你都需要一些全局的Ajax處理程序，你可以重新綁定它們。如果你想區分這個調用，你可以使用隱藏字段來跟蹤發起ajax調用的控件。 – Tariqulazam

是的，上面的答案應該可以幫到你。基本上有一個Jquery API，它將處理從客戶端到服務器的任何ajax請求。所以當你做任何ajax操作時，它會調用觸發器的函數。你可以把你的自定義css /圖像或某些你可以作爲ajax操作指示器的函數。

來源

2012-10-22 04:26:49

如果我想要其他ajax驅動的頁面部分，並且我需要直接從Webgrid區分這個調用，我該如何實現這一點？ –

在排序或分頁時顯示Ajax加載指示器ASP.net MVC Webgrid

回答

相關問題