blockUI issue

blocking unblocking randomly causes parentNode error

by pareshvarde

HTML

<script src="https://dl.dropboxusercontent.com/u/2781659/js/jquery-2.0.3.js"></script>
<script src="https://dl.dropboxusercontent.com/u/2781659/js/jquery.BLOCKUI.js"></script>
<body>
    <div id="loaderContainer">
        <div id="loader" style="display: none;">
            <h4>Loading...</h4>
            <div style='margin: 10px 20px;' class='progress progress-striped active'>
                <div class='bar' style='width: 100%'></div>
            </div>
        </div>
    </div>    
    <div id="blockSection" style="height: 300px; width: 600px; background-color: gray">
        This content will be blocked
    </div>
</body>

JavaScript

$(function () {
           window.setInterval(function () {
                myBlock();
                myBlock($('#blockSection'));
                window.setTimeout(function () {
                    myUnblock();
                    myUnblock($('#blockSection'));
                }, 5000)
            }, 2000);
        });

        myBlock = function (surroundingControl, message) {
            console.log('blocking');

            if (message)
                $("#loader h4").text(message);
            else
                $("#loader h4").text('Loading...');

            if (surroundingControl)
                surroundingControl.block({ message: $('#loader'), baseZ: 1200 });
            else {
                $.blockUI.defaults.message = $('#loader');
                $.blockUI.defaults.baseZ = 1200;
                $.blockUI.apply();
            }
        };

        myUnblock = function (surroundingControl) {
            console.log('unblocking');

            if (surroundingControl)
                surroundingControl.unblock();
            else
                $.unblockUI.apply();
        };