Since you are not using Update Panels, you are doing a full postback. Then
Then why not use JQueryJQuery script which binds JS code on change like below
Add a class to your dropdown. Like below
asp:DropDownList ID="ddl_DCL_ModifiedDate" CssClass="ddl_DCL_ModifiedDate"CssClass="ddl_DCL_ModifiedDate"
Write code inside DOM ready in your webpart to trigger initial JS codes
$(document).ready(function () {$(document).ready(function () {$(".ddl_DCL_ModifiedDate").change(function()$(".ddl_DCL_ModifiedDate").change(function(){{//Here show an DIV which is hidden by default & has properties like width 100% height 100% & transparency. It can contain HTML contents also like image/test$("#divMaskDashboard").show();$("#divMaskDashboard").show();});});});});
So this is how it works
- You attach a change handler in the DOM ready on your dropdown using CSS class name
- This will display a image/div when the dropdown in changed while the postback is happening in the background
- You complete postback happens & the image/div gets hidden automatically
I normally use below CSS for the DIV #divMaskDashboard { /* opacity: 1; background: rgba(16, 22, 23,0.7);*/ width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; background-color: rgb(16,22,23); color: #000; z-index: 99999; display: none; filter: alpha(opacity=60); -moz-opacity: 0.6; -khtml-opacity: 0.6; opacity: 0.6; }
#divMaskDashboard {
/*
opacity: 1;
background: rgba(16, 22, 23,0.7);*/
width: 100%;
height: 100%;
position: fixed;
left: 0px;
top: 0px;
background-color: rgb(16,22,23);
color: #000;
z-index: 99999;
display: none;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}