Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issues with Sortable and Bootstrap 5 responsive #2142

Open
SoftCircuits opened this issue Dec 18, 2022 · 3 comments
Open

Issues with Sortable and Bootstrap 5 responsive #2142

SoftCircuits opened this issue Dec 18, 2022 · 3 comments

Comments

@SoftCircuits
Copy link

I know this component is pretty old, and I'm not sure to what extent it's still supported.

I'm trying to use it on a Boostrap 5 responsive page and am hitting the following issues.

  1. My list consists of a series of <div class="col-lg-6"> elements. So it shows two per row. But if I drag an element from the left side to the right-side element, nothing happens. In order to swap the two elements, I must also drag the element down. This is not intuitive. Is there a workaround?
  2. When I show it on a mobile device (only one element per row), no dragging or sorting whatsoever is visible.
  3. Despite explicitly setting scroll: true, no scrolling occurs if I drag an element to the bottom of the browser window. Are additional steps required.

Note: I tried created a CodePen to show all this but was unable to find a CDN for the sortable components. If someone knows how to do this, my CodePen is at https://codepen.io/softcircuits/pen/QWBWwwJ.

@mgol
Copy link
Member

mgol commented Dec 19, 2022

Thanks for the report. Does the issue you describe exist when jQuery UI 1.12.1 is used or only with jQuery UI 1.13.0 or newer?

@SoftCircuits
Copy link
Author

SoftCircuits commented Dec 19, 2022

@mgol I have no idea. To be honest, it took me some time to figure out which files I needed as the download feature on the jQuery UI website downloads a boatload of files. I have no reason to assume this is new to 1.13.0. (I'm using 1.13.2.)

If you can reference an online version of the files I needed, I'd be happy to update my CodePen and you could see it firsthand.

@mgol
Copy link
Member

mgol commented Dec 19, 2022

The jQuery UI minified file contains all the widgets so it also includes Sortable. Your codepen doesn't include jQuery, though, which is why it doesn't work. It looks like the issue is in jQuery UI 1.12.1 as well: https://codepen.io/mgol/pen/yLqLEKg

Since the issue is already in 1.12, given limited team resources it's not likely to be fixed by the UI team; see the project status at https://blog.jqueryui.com/2021/10/jquery-maintainers-update-and-transition-jquery-ui-as-part-of-overall-modernization-efforts/. PRs are welcome if they're not too complex.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment