0

Has anyone used the jQuery UI Sortable widget on a Bootstrap 5 responsive page?

My page has a series of <div class="col-lg-6"> elements, so it shows two per row.

The sorting works. But I have the following issues:

  1. If I drag an item on the left over to the item on the right, nothing happens. It only swaps the two items if I also drag it down.
  2. If I use a mobile device layout (1 item per row), nothing drags or sorts at all.

I created a CodePen for this but I was unable to find a CDN with the appropriate jQuery UI components. If anyone knows where those are, I can add them. My CodePen is at https://codepen.io/softcircuits/pen/QWBWwwJ.

Improve this question

1 Answer 1

Reset to default
0
  1. This seems to be working after setting the tolerance: 'pointer' option.
  2. This appears related to the detection of touch events (vs mouse events), which jQuery UI doesn't support. See this question.

Also, scroll wasn't working for me. This was due to the <body> having a overflow-x: hidden style.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.