smart sortable grid

[jqwidgetsdev]

Hi,

For smart sortable, what is the equivalent of jqwidget’s vue-sortable-displayastable?

I want to be able to display a grid with 4 items.

Thank you.

[Markov]

Hi,

The same sample logic could be re-used for smart.sortable. The jqwidgets sample creates a sortable list which is styled as a table. You should be able to reuse this logic with smart.sortable, too.

Regards,
Markov

[jqwidgetsdev]

For a 2×2 grid, what would the <smart-sortable mode= be?

[svetoslav_borislavov]

Hi,

Smart.Sortable direction can be horizontal or vertical. In one item you can nest sub-items but you cannot move the sub-items. Only the parent item will be able to move.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[jqwidgetsdev]

Hi,

But I cannot chose both horizontal and vertical direction at the same time.
How can I use smart.sortable in a 2×2 grid like the jqwidgets example (https://www.jqwidgets.com/vue/vue-sortable/#https://www.jqwidgets.com/vue/vue-sortable/vue-sortable-displayastable.htm)?

Thanks in advance

[svetoslav_borislavov]

Hi,

Similar functionality can be achieved by changing the direction of the .smart-sortable-container and allowing the flex-wrap.
Please see the demo provided below:
https://codepen.io/svetoslavb04/pen/abjyRwz?editors=1100

I hope this helps!

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[svetoslav_borislavov]

Hi,

Our Smart.Sortable is not intended for such scenarios. It can be vertical or horizontal.
To make it a table the whole CSS should be rewritten.

Best Regards,
Svetoslav Borislavov

Smart UI Team
https://www.htmlelements.com/

[jqwidgetsdev]

Hi Svetoslav,

Yes, thanks your example helped me a lot.

Best regards.

[Author]

Posts