jquery.blockUI plugin not working
I have a simple div that I want to disable:
<div id="MyDiv">
</div>
I perform below:
$('#MyDiv').blockUI({
message: '<h1>This has been blocked!</h1>',
css: { border: '3px solid #a00' }
});
In runtime an error is thrown:
"Object does not support/accept this property or method 'blockUI'"
I have included it using:
<script type="text/javascript" src="@Url.Content("~/MyScripts/jquery.blockUI.js")"></script>
and I use jquery.blockUI version Version 2.66.0-2013.10.09 which is compatible with the version of jquery I am using jquery-1.10.2 and jquery-ui.1.10.3
Any ideas what is it failing?
Answer
You have to do something like this , you are calling blockUI like this $('#MyDiv').blockUI but see the documentation thats not the correct way of calling
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://malsup.github.io/jquery.blockUI.js">
</script>
<script>
$(document).ready(function() {
$('#demo3').click(function() {
$.blockUI({
message: '<h1>This has been blocked!</h1>',
css: { border: '3px solid #a00' }
});
});
});
</script>
<body>
<div id=MyDiv"></div>
<div id="demo3">fff</div>
</body>
</html>
working fiddle