CODEWITHSUNDEEP
jqueryhtmlasp.netblockuijquery-blockui
Saurabh Palatkar
Saurabh Palatkar

Reputation: 3384

Block UI not working for blocking the div

I am trying to block a particular div (div with id "blockit") on clicking a button (button with id "Button1"), for that I am using block UI plugin. But I am unable to block the div on button click. Here is my code

<script src="jQuery 1.10.1.min.js"></script>
<script src="blockui.js"></script>

<script type="text/javascript">
        $(document).ready(function () {
            $('#Button1').click(function () {
                $('div.blockit').block({

                    message: '<h1>Processing</h1>',
                    css: { border: '3px solid #a00' }


                });
                setTimeout($.unblockUI, 2000);
            });
        });

    </script>

<body>
    <form id="form1" runat="server">
        <div>
            <asp:Button ID="Button1" runat="server" Text="Button" />

        </div>
        <div id="blockit" style="width: 200px; height=200px;"></div>
    </form>
</body>

Please tell me where I am making mistake. Thanx in advance

Upvotes: 2

Views: 1857

Answers (2)

Karl Anderson
Karl Anderson

Reputation: 34846

For even easier and faster selector, because jQuery's Sizzle engine is optimized to use ID selectors, do the following:

$('#blockit').block({
    message: '<h1>Processing</h1>',
    css: { border: '3px solid #a00' }
});

The selector you had previously was $('div.blockit'), which will traverse the entire DOM and find all DIV elements before looking for one with the ID of blockit.

Upvotes: 1

Pbk1303
Pbk1303

Reputation: 3802

instead of specifying blockit as an id you have given it as class in jquery. Try this

       $('div#blockit').block({.....})

Upvotes: 2

Related Questions