1、Head标签内引入所需要的链接css样式
<th:block th:include="include :: select2-css" />
2、在需要整多选下拉框的地方加入这个
<div class="form-group">
<label class="col-sm-3 control-label">能源分类+分项:</label>
<div class="col-sm-8">
<select name="collectEnergytypecode" class="form-control select2-multiple" th:with="type=${@dict.getEnergyName()}" required multiple>
<option th:each="dict : ${type}" th:text="${dict.name}" th:value="${dict.code}"></option>
</select>
</div>
</div>
3、在script标签上面添加js
<th:block th:include="include :: select2-js" />
4、script标签里面加入方法
$(function() {
$('#collectEnergyclasscode').select2({
placeholder: "请选择",
allowClear: true
});
})
这篇博客介绍了如何在HTML页面中使用Thymeleaf模板引擎结合Select2库来创建一个多选下拉框。首先,在Head标签内引入了Select2的CSS样式,然后在需要的位置添加了包含Select2样式的form-group和select元素。接着,在script标签上引入Select2的JS文件,并在页面加载完成后初始化Select2,设置占位符和允许清空选项的功能。

被折叠的 条评论
为什么被折叠?



