2013-07-03 3 views
1

Я хочу заблокировать экран своей веб-страницы всякий раз, когда есть активность ajax и разблокировать экран при завершении этой операции ajax. Для этого я использую block ui. Но он не работает в моем случае, я не знаю, почему. Вот мой код:Блокирующий экран на обратном вызове ajax

<head runat="server"> 
<script type="text/javascript" src="jQuery 1.10.1.min.js"></script> 
<script type="text/javascript" src="blockui.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $(document).ajaxStart($.blockUI).ajaxStop($.unblockUI); 
    }); 
</script> 
<title></title> 

<body> 
    <form id="form1" runat="server"> 
    <div> 
     <input id="Button1" type="button" value="button" onclick="__doPostBack('UpdatePanel1', '');" /> 
    </div> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
     <ContentTemplate> 
      <div id="blockit" style="width: 200px; height: 200px;"> 
      </div> 
     </ContentTemplate> 
    </updatepanel> 
    </form> 
</body> 
</html> 

Я не знаю, что случилось с моим кодом. пожалуйста, помогите мне

+0

Это просто, как это делается в своих документах. Возможно, вам следует обратиться к автору. – mekwall

ответ

1

Когда вы используете UpdatePanel, вы можете использовать функции javascript, которые прилагаются. Функции jQuery не работают, потому что они предназначены для jQuery ajax-вызова, а не для UpdatePanel.

Таким образом, вы можете настроить этот код, где вы открываете и закрываете полный экран.

<script type="text/javascript"> 
    // if you use jQuery, you can load them when dom is read. 
    $(document).ready(function() { 
     var prm = Sys.WebForms.PageRequestManager.getInstance();  
     prm.add_initializeRequest(InitializeRequest); 
     prm.add_endRequest(EndRequest); 
    });   

    function InitializeRequest(sender, args) { 
     // Open the full wait screen 
     $("#overlay").show(); 
    } 

    function EndRequest(sender, args) { 
     // close the full wait screen 
     $("#overlay").hide();  
    } 
</script> 

Обновление: О Sys. ->http://msdn.microsoft.com/en-us/library/bb311028.aspx

И оверлей часть на HTML ....

<div id="overlay" style="display:none;"> </div> 

CSS

#overlay { 
    position: fixed; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    background-color:#000; 
    opacity: .75; 
    z-index: 9999999; 
} 

Overlay ссылка: http://dabblet.com/gist/2894437
https://stackoverflow.com/a/10945291/159270

Смежные вопросы