14

背景

我正在寻找一个允许用户过滤源列表的基于 jQuery 或 JavaScript 的组合框穿梭小部件。源列表是一个组合框(左侧),目标列表是第二个组合框(右侧)。

小样

小部件应类似于:

小样

现有的 jQuery小部件

引导转移

用法

用户可以:

  1. 键入正则表达式以过滤源列表(例如,Toy.*)。
    • 小部件隐藏所有与过滤器表达式不匹配的项目。
  2. 在源列表中选择一个或多个项目(使用单击、控制单击和 shift 单击选择)。
  3. 单击 将>>项目从源列表传输到目标列表。
  4. 清除过滤器以显示完整的源列表。

技术的

理想情况下,组合框将使用多选 HTML 组合框,并且标记很简单:

<select name="sourceList" id="sourceList" size="20" multiple="multiple">
  <option value="1">Toyota</option>
  <option value="2">Mitsubishi</option>
  <option value="3">Nintendo</option>
  <option value="4">Samsung</option>
  <option value="5">Bank of Kyoto</option>
</select>

<select name="destinationList" id="destinationList" size="20" multiple="multiple">
  <option value="6">Mazda</option>
  <option value="7">Fuji</option>
  <option value="8">Honda</option>
</select>

<script>
  $('#sourceList').shuttle();
</script>

发现

这些很接近:

这些几乎是完美的:

我正在寻找批量分配 3000 - 5000 个项目的类别,并认为这将是完成这一壮举的快速方法。(日本公司名称纯属虚构;实际上,这些名称通常会有一个共同的单词或短语。)

问题

什么是满足这些要求的免费开源小部件(jQuery 或纯 JavaScript)?

有关的

相关链接:

4

1 回答 1

6

一个不错的 jquery/bootstrap 插件(多选,两个窗格,使用正则表达式过滤):

引导双列表框: http: //www.virtuosoft.eu/code/bootstrap-duallistbox/

于 2014-04-18T07:49:16.367 回答