I can not manage to get the jquery-layout plugin's options to set. The default renders correctly, but the options don't. I attempt to set resizable and slidable on document ready, but when I alert for resizable it returns false. Can anyone spot what's going wrong here?
js:
$(document).ready(function() {
var myLayout = $('body').layout({
west: {
resizable: true,
resizeWhileDragging: true,
slidable: true
}
});
alert(myLayout.options.west.resizable); //returns false
});
html:
<body>
<div class="ui-layout-center">Center
<div id="board">
</div>
<button onclick="set_board();">New Game!</button>
<button onclick="execute_turn();">Turn!</button>
</div>
<div class="ui-layout-east">East</div>
<div class="ui-layout-west">West</div>
</body>
It works for me when jqueryui is included also, like in the jquery-layout Simple demo at http://layout.jquery-dev.net/demos/simple.html.
Make sure that you first include jquery-ui
, and then jquery.layout
, else it won't work.
Example:
<script src="lib/jquery/jquery-ui-1.10.4.js"></script>
<script src="lib/jquery/jquery.layout-1.3.0-rc30.79.js"></script>
as @codeless have mentioned you need to load 'jquery-ui' prior to layout (by explicitly importing 'jquery-ui' first), but make sure you're also loading 'resizable' and 'draggable' modules of jquery-ui
import 'jquery-ui/ui/widgets/resizable';
import 'jquery-ui/ui/widgets/draggable';
otherwise pane resize won't work
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With