confused using Jquery in Asp.net (User control) -

currently working in page has 3 usercontrols. need put loading image when search in 1 user control used code below:

the div in html:

<div class="loading">     <img src="../images/loading/466.gif" title="cargando" alt="cargando" class="load" /> </div> 

the jquery (i found in google, before saw lot of examples, don't know if use settimeout this)

function showprogress() { var table = $("#table"); table.css("opacity", ".2");     settimeout(function () {         var modal = $('<div />');         modal.addclass("modal");         $('table').append(modal);         var loading = $(".loading");         loading.show();         var top = math.max($(window).height() / 2 - loading[0].offsetheight / 2, 0);         var left = math.max($(window).width() / 2 - loading[0].offsetwidth / 2, 0);         loading.css({ top: top, left: left }         );     }); } 

and asp button (it inside user control):

<asp:button runat="server" id="btnsearch" skinid="botonestandar" text="buscar" onclick="btnsearch_click"                                                      validationgroup="basicfilter" onclientclick="return showprogress();"                                                     meta:resourcekey="btnsearchresource1" /> 

my problem

it when made search div modal show loading image, how block controls of user controls @ page?.

i don't know if show loading .

i'm sorry if did bad i'm starting jquery.

thanks.

you should try out block ui plugin here jsfiddle on how works

so have add reference block ui script in code. on click of search button call:

$.blockui({ message: '<div class="loading"><img src="../images/loading/466.gif" title="cargando" alt="cargando" class="load" /></div>' }); 

the above code block functions on screen , show custom message(which in case html passed plugin)

after search returns result should do:

$.unblockui(); 

this remove loading image , user can again interact page.