背景
我正在寻找一个允许用户过滤源列表的基于 jQuery 或 JavaScript 的组合框穿梭小部件。源列表是一个组合框(左侧),目标列表是第二个组合框(右侧)。
小样
小部件应类似于:
现有的 jQuery小部件:
用法
用户可以:
- 键入正则表达式以过滤源列表(例如,
Toy.*
)。- 小部件隐藏所有与过滤器表达式不匹配的项目。
- 在源列表中选择一个或多个项目(使用单击、控制单击和 shift 单击选择)。
- 单击 将
>>
项目从源列表传输到目标列表。 - 清除过滤器以显示完整的源列表。
技术的
理想情况下,组合框将使用多选 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>
发现
这些很接近:
- http://archive.plugins.jquery.com/project/crossSelect - 无过滤器
- http://quasipartikel.at/multiselect/ - 不允许多选
- http://blog.jeremymartin.name/2008/02/easy-multi-select-transfer-with-jquery.html - 无过滤器
- http://davidwalsh.name/demo/multi-select.php - 使用 MooTools;没有过滤器
- http://devblog.jasonhuck.com/assets/comboselect/ - 没有过滤器
- http://www.dhtmlgoodies.com/index.html?whichScript=multiple_select - 无过滤器
- http://blog.cbolson.com/expanding-multiple-select-list-with-search-filter/ - MooTools
这些几乎是完美的:
- https://github.com/rabihkodeih/bootstrap-transfer - 使用
div
标签(而不是<select>
)? - http://www.senamion.com/blog/jmultiselect2side.html - 没有正则表达式搜索
- http://mind2soft.com/labs/jquery/multiselect/ - 没有正则表达式搜索
我正在寻找批量分配 3000 - 5000 个项目的类别,并认为这将是完成这一壮举的快速方法。(日本公司名称纯属虚构;实际上,这些名称通常会有一个共同的单词或短语。)
问题
什么是满足这些要求的免费开源小部件(jQuery 或纯 JavaScript)?
有关的
相关链接: