更改 jquery 可排序的排序行为

发布于 2024-12-13 23:03:15 字数 633 浏览 0 评论 0原文

我有一个像本页上的第二个示例一样的可排序:

http://jqueryui.com/demos/sortable/items.html< /a>

可排序的是目标的混合:

  • 那些可以拾取和重新排列的
  • 禁用项目,不能拾取(但是放置目标)。

问题在于该组件解释我排序意图的方式。例如,拾取以下列表的第一个元素并将其拖动到第四个位置将如下所示:

ABCXX ==> BCXAX

这里的 X 表示禁用的项目。

在我的应用程序中,我希望排序行为有所不同。当拾取目标并将其放置在禁用项目(X)上时,列表不应移动以容纳目标,而是目标和禁用项目应交换位置。

使用与之前相同的示例(从第 1 个拖动到第 4 个):

ABCXX ==> XBCAX

如果放置目标正常(即未禁用),则行为应与之前相同(从第 1 个拖动到第 3 个):

ABCXX ==> BCAXX

可以将其想象为想要重新安排日历上的约会,当您从某个日期中选择一个约会并将其放在空日期上时,您不希望其他约会拖后一天。

I have a sortable like the 2nd example on this page:

http://jqueryui.com/demos/sortable/items.html

The sortable is a mix of targets:

  • Those that can be picked up and rearranged
  • Disabled items, which cannot be picked up (but are drop targets).

The problem is in the way the component interprets my intention on sorting. As an example picking up the first element of the following list and dragging it to the fourth position will look like this:

A B C X X ==> B C X A X

Here the X's denote the disabled items.

In my application I would like the sorting behaviour to be different. When a target is picked up and placed over a disabled item (an X) then the list should not shift along to accomodate the target, but instead the target and the disabled item should swap positions.

Using the same example as before (drag from 1st to 4th):

A B C X X ==> X B C A X

If the drop target is normal (ie not disabled) the behaviour should be the same as before (drag from 1st to 3rd):

A B C X X ==> B C A X X

Think of it like wanting to re-arrange appointments on a calendar, when you pick one up from a date and drop it on an empty date, you wouldn't want the other appointments to shuffle along by one day.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

戏剧牡丹亭 2024-12-20 23:03:15

这并不完全是您问题的答案,但我认为当它不适合这种情况时,您不应该强迫使用现成的解决方案。

我认为您应该创建自己的控件来保留元素并使用 jquery-ui 的可拖动来实现行为。您的用例在一些基本行为逻辑方面与示例不同。

如果你有更多的要求,这对未来也有好处。

This will not exactly be an answer to your question, but I think you should not force using a ready solution when it doesn't suit the case.

I think you should create your own control to keep the elements and use jquery-ui's draggables to implement behaviour. Your usecase differs from the example in some basic logic of behaviour.

It would be beneficial for the future also, if you get more requirements.

把昨日还给我 2024-12-20 23:03:15

我已经将 jsfiddle 与您想要的功能放在一起。

基本上,我结合了可排序的更改功能,并检查助手刚刚传递的元素是否被禁用。如果是,那么我将该元素移动到助手开始的位置。

这是 jsfiddle http://jsfiddle.net/YjhzR/3/

希望这有帮助!

更新:

http://jsfiddle.net/YjhzR/6/

I've put together a jsfiddle with your desired functionality.

Basically I tie into the change function of sortable and I check to see if the element the helper just passed over is disabled. If it is then I move that element to where the helper started from.

Here is the jsfiddle http://jsfiddle.net/YjhzR/3/

Hope this helps!

Update:

http://jsfiddle.net/YjhzR/6/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文