javascript - 在 Itemselector extJS 中拖放

Question

如何禁用 Itemselector 中的项目(参见附件) ？我想在将项目移动到目标字段时禁用源字段中的某些项目。你能帮我解决这个问题吗？ ATTACHMENT - Image

我进行了很多搜索并应用了一切可能的方法。我发现没有办法。

由于默认情况下没有禁用选项(据我所知)，我将删除列表中的项目并在需要时再次添加。这里我有一个疑问。用户可以从左侧拖动并将其放在右侧，也可以从右侧拖动并将其放在左侧。如何知道他从哪里拖来的？有没有任何方法或功能可以确定源位置？

Answer 1

不幸的是，这需要相当多的手动工作，因为 ExtJS 不支持禁用网格、组合框等中的记录。

我已经描述过here如何创建带有禁用记录的组合框。由于组合框和项目选择器都依赖于其底层的 boundlist，所以这很方便。

正如您在ItemSelector的源代码中发现的那样，它有两个属性，fromField和toField，其中包含两个 >多选组件。您可以将事件附加到这些列表或其各自的boundlist。

一个快速的 fiddle ，显示如何灰显禁用元素以及如何防止拖/放禁用元素:https://fiddle.sencha.com/#view/editor&fiddle/2382

缺少的是该按钮在添加之前不会检查记录是否被禁用，您必须为此重写 ItemSelector 的 onAddBtnClick 方法。如果您从 ItemSelector 派生一个新的自定义组件，这比我的 Quick and Dirty fiddle 中的组件要容易得多。因此，我强烈建议您定义自己的从 ItemSelector 派生的自定义组件。