BlockUI for a certain
only

Question

I'm trying to block a div (with id="blockme") in my page that contains a gridview while the gridview is loading. I found the code below at Github but this code blocks the whole page.

<script type="text/javascript">
        Page = Sys.WebForms.PageRequestManager.getInstance();
        Page.add_beginRequest(OnBeginRequest);
        Page.add_endRequest(endRequest);

        function OnBeginRequest(sender, args) {
            $.blockUI();
        }
        function endRequest(sender, args) {
            $.unblockUI();
        }

 </script>

I looked into stackoverflow and I found this answer which shows how to block a certain div on button click.

My problem is that I don't want to use the button click event but use page begin request and end request instead events to block my div.

I tried doing this but it doesn't work:

    function OnBeginRequest(sender, args) {
        $('#blockme').blockUI();
    }
    function endRequest(sender, args) {
        $('#blockme').unblockUI();
    }

The link you provided has a solution to Trigger the event at Page Load. Is that not sufficient? — IntermediateCoder, Jul 21 '15 at 12:01
It adds a hidden button and uses a click event, I wanted to know if it's possible to use the page request and end request instead — user3340627, Jul 21 '15 at 12:03
@aRrOwDreWLs, thank you for your suggestion, actually I found a helpful question on SO mentioned in my answer, and it says that blockUI is only used to block the whole page. — user3340627, Jul 21 '15 at 12:16

score 0 · Accepted Answer · edited May 23 '17 at 11:51

These two links helped me solve it here and this SO question

Here's how it worked:

<script type="text/javascript">
        Page = Sys.WebForms.PageRequestManager.getInstance();
        Page.add_beginRequest(OnBeginRequest);
        Page.add_endRequest(endRequest);

        function OnBeginRequest(sender, args) {
            $('div#blockme').block({
                message: '' ,
                overlayCSS: { backgroundColor: '#fff'   }
             });
        }
        function endRequest(sender, args) {
            $('div#blockme').unblock();
        }

 </script>

BlockUI for a certain only

1 Answers1

BlockUI for a certain
only