我看到的所有在线示例都显示了如何将 X-Editable 与 Select2 库一起使用，都使用的是旧版本的 select2。
X-Editable - http://vitalets.github.io/x-editable/ with
Select2 - https://select2.github.io/ 好几个星期了，但运气不佳。
最近有没有人将这两个库与过去一年发布的版本一起使用？
【问题讨论】：
标签： javascript jquery jquery-select2 x-editable
我最近也遇到了这个问题，想出了一个作弊方法。它使用标准的 'select' 并将其转换为 select2 on show：
$('#stages').editable({
source: [ {value: 1, text:'ahaa'}, {value: 2, text: 'ohooo'} ]
}).on('shown', function(e, editable){
editable.input.$input.select2({
width: 250,
minimumResultsForSearch: Infinity
});
editable.input.$input.select2('val', editable.input.$input.val());
}); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/js/bootstrap-editable.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/js/select2.min.js"></script>
<a href="#"
id="stages"
data-type="select"
data-placement="right"
class="editable editable-click"
data-value="1"
data-title="Select something"></a>【讨论】：
Select2 4.0.0 与 X-Editable 不兼容，未来似乎不会提供任何支持。
回到一月份I created a ticket about it，维护者没有任何回应。 X-Editable 项目目前已冻结并正在寻找维护者。
【讨论】：
我已经获得了最新版本的 Select2 (4.0.3) 以使用 x-editable。
使用 x-editable 的这个分支（不是我，是 Select2 的作者之一） https://github.com/select2/x-editable
然后对于您在 js 文件中选择的任何发行版，找到此行：
tpl:'<input type="hidden">',
改成这样：
tpl:'<select multiple></select>',
【讨论】：
我想最近的版本现在还可以，但是 X-Editable 的 DOC 声明您需要导入 select2 的 js 和 css，这是我的工作示例：
<link href="css/select2/select2.min.css" rel="stylesheet" type="text/css" />
<link href="css/select2/select2-bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="assets/jquery/dist/jquery.min.js"></script>
<script src="assets/bootstrap3-editable/bootstrap-editable.min.js"></script>
<script src="assets/select2/select2.full.min.js"></script>
<script type="text/javascript">
$('.editable_example').editable({
source: [
{id: 1, text: 'Test1'},
{id: 2, text: 'Test2'},
{id: 3, text: 'Test3'}
]
});
</script>
<body>
<!-- normal code and than the x editable input -->
<a href="#" data-name="example" data-type="select2"
class="editable_example" data-pk="5" data-url="ajax/update_row.php"
data-title="Select one item" data-value="5">
John Example
</a>
</body>
我强烈建议花几分钟时间到read the DOCs 学习一些观察，例如需要导入 select2 的 js 和 css 之类的东西。
【讨论】：
在最近的一个项目中也遇到了这个问题，我专门为 select2 版本 4.0.2 创建了一个自定义扩展，该扩展适用于 x-editable。如果需要，我还添加了每行拥有唯一下拉数据的功能。
博客文章和下载地址为www.fifthmorrison.com
同意这个插件的卓越性，如果有人确实有时间接管它，在这里肯定会受到赞赏。
希望在此期间有所帮助！
【讨论】：