Resize the grid make the items collapsed.

[jpremkumar]

When the page is dynamically resized, the items (nodes) inside the grid should auto adjust.

i.e. full width (Default) [1,2,3,4,5,6],
In 75%, it should come as
[1,2,3]
[4,5,6]

in 50%
[1,2]
[3,4]
[5,6]

in 30$ is should be
[1]
[2]
[3]
[4]
[5]
[6]

I've referred the Responsive Grid demo. I'm expected the above behavior. But when resize, the items are overlapping. Also, while maximize, the items are not arranging the same order.

Check out this example and the refer the below screenshots for the issue.

[troolee]

Hi,

Thanks for reporting an issue. This feature is pretty experimental and not ready for production usage. But we will take a look on it.

//cc @radiolips

[vishakaw1]

Hi, I pulled out the latest commit from github(#786) and build a grid with 6 widgets.Following scenario shows the expected behaviour.
100%
[1,2,3]
[4,5,6]

50%
[1,2]
[4,5]
[3,6]

one column mode
[1]
[2]
[3]
[4]
[5]
[6]

But when resizing, widget order, Number of rows and positions are all wrong like following.

100%
[1,2,3]
[4,5,6]

50%
[0,2]
[3.5]
[ ,1]
[ ,4]

one column mode
[0]
[2]
[3]
[5]
[1]
[4]

Also, while maximize, the item sizes are wrong and are not arranging the same order.

Can we expect this behaviour from your version 1.0 release.

responsive-gridstack.zip

[radiolips]

Unfortunately, this won't make 1.0, but hopefully I'll fix up the responsive code shortly thereafter.

[nicoesiea]

Hello,
Is this library still in progress, specially this feature?
I need to have this kind of behaviour, at least manage two columns of widgets when the size is a bit bigger than the minimal (with one widget upper the other)
Thank you for this job
Regards
Nico

[radiolips]

This library is very much still in progress. The responsive feature is on the road map, but probably won't be included in the next release (which we hope to be version 1). We'll be working on the responsive grid as quickly as we can, but eliminating dependencies and tightening up grid movement currently have higher priority.

[vikasKacholia]

Hello ,

is there any update on this ?
I also see the ordering get changes on window resize.

i also have a a requirement where on resize instead of responsive behavior i.e changing the size of grid based on window size my grids should go to next row.
any idea how to achieve this?

[radiolips]

Hey @vikasKacholia . This is still in the works, but there are some other features that we're working on before this one. I'm still leaving this open, and I'll leave your other ticket (#1031 ) open as well, until we can look into that.

[adumesny]

closing this as I re-wrote on setColumn() handles responsive design - see https://gridstackjs.com/demo/responsive.html