cellHeight(val) does not work properly on v0.5.3 (but OK on v0.5.2) #1068
Description
Subject of the issue
Seems like function cellHeight(val) doesn't work properly on v0.5.3.
E.g.,
- not able to auto resize height while resizing (Browser) Window, and
- (re)assign height by calling this function (although the one in constructor
$('.grid-stack').gridstackcan set up height correctly)
However, it works fine after I downgrade to v0.5.2.
There should be something wrong for this version, but not sure if anyone has already find out the issue and prepare to fix it
Environment
- Failed on
v0.5.3 - Success on
v0.5.2
Steps to reproduce
I think it's easy to reproduce(?
Sorry for not familiar with jsfiddle. QQ
Simple example
- Save following code as local
.htmlfile and open it with browser - Uncomment
#L17to see the difference #L21also shows thecellHeight(val)after init (constructor)
<html><head><link href="https://cdn.jsdelivr.net/npm/gridstack@v0.5.2/dist/gridstack.min.css" rel="stylesheet"></head><body>
<div class="grid-stack">
<div class="grid-stack-item" data-gs-x="0" data-gs-y="0" data-gs-width="2" data-gs-height="2" style="background-color:red">
<div class="grid-stack-item-content">11111</div></div>
<div class="grid-stack-item alert-success" data-gs-x="2" data-gs-y="0" data-gs-width="2" data-gs-height="2" style="background-color:green">
<div class="grid-stack-item-content _align_center">22222</div></div>
<div class="grid-stack-item" data-gs-x="4" data-gs-y="0" data-gs-width="2" data-gs-height="2" style="background-color:blue">
<div class="grid-stack-item-content">33333</div></div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gridstack@v0.5.2/dist/gridstack.all.js"></script>
<!-- uncomment next line to compare function `cellHeight(val)` between v0.5.2 and v0.5.3 -->
<!-- <script src="https://cdn.jsdelivr.net/npm/gridstack@v0.5.3/dist/gridstack.all.js"></script> -->
<script>$(function(){
$('.grid-stack').gridstack({disableOneColumnMode:true,verticalMargin:0,cellHeight:'auto'});
$('.grid-stack').data('gridstack').cellHeight(20); // change height after initialization
});</script>
</body></html>