Bootstrap多选下拉框实现

来源：互联网发布：淘宝超级链接怎么做编辑：程序博客网时间：2024/06/05 05:08

引用的js如下：

</script><!-- 多选下拉框開始 --><link rel="stylesheet" href="/rgssys/static/bootstrap-select/dist/css/bootstrap-select.min.css"><script src="/rgssys/static/bootstrap-select/dist/js/bootstrap-select.min.js"></script><script src="/rgssys/static/bootstrap-select/dist/js/i18n/defaults-*.min.js"></script><!-- 多選下拉框結束 -->

js代码如下：

$(document).ready(function() {$('#programmingLanguage').selectpicker({        'selectedText': 'label'    });var programmingLanguage = '${interviewRecords.programmingLanguage}';if(programmingLanguage != null && programmingLanguage != ''){var arr=programmingLanguage.split(',');    $('#programmingLanguage').selectpicker('val', arr);}$('#foreignLanguage').selectpicker({        'selectedText': 'label'    });var foreignLanguage = '${interviewRecords.foreignLanguage}';if(foreignLanguage != null && foreignLanguage != ''){var arr=foreignLanguage.split(',');    $('#foreignLanguage').selectpicker('val', arr);}});

html代码如下：

<tr><td class="active"><label class="pull-right">编程语言：</label></td><td><form:select path="programmingLanguage" id="programmingLanguage" class="form-control" multiple="true"><form:options items="${fns:getDictList('programmingLanguage')}" itemLabel="label" itemValue="value" htmlEscape="false"/></form:select></td><td class="active"><label class="pull-right">外语种类：</label></td><td><form:select path="foreignLanguage" id="foreignLanguage" class="form-control" multiple="true"><form:options items="${fns:getDictList('foreignLanguage')}" itemLabel="label" itemValue="value" htmlEscape="false"/></form:select></td></tr>

阅读全文

0 0