bootstrap 下拉多选框进行多选传值问题代码分析

2019-11-19 17:35:12

字体：大中小

来源：转载

供稿：网友

项目开发遇到个问题，就是引入bootstrap下拉多选框进行多选的时候，用form表单提交到后台，获取不到多选的值，只能获取的选择的第一个值。

纠结了会。

jsp页面需要引入这东东~

<link rel="stylesheet" href="${ctx}/js/selectbootstrap/dist/css/bootstrap-select.min.css" rel="external nofollow" ><script src="${ctx}/js/selectbootstrap/dist/js/bootstrap-select.min.js"></script>

直接上代码~

<head><script type="text/JavaScript"> function fun(){var str=[];var obj = document.getElementById("approverq");for(var i=0;i<obj.options.length;i++){if(obj.options[i].selected){str.push(obj.options[i].value);// 收集选中项}}$("#approver").val(str);}</script></head><body><div class="l_err" style="width: 100%; margin-top: 2px;"></div><form id="form" name="form" class="form-horizontal" method="post"action="${ctx}/leave/editEntity.shtml"><input type="hidden" class="form-control checkacc" value="${leave.id}" name="LeaveFormMap.id" id="id"><section class="panel panel-default"><div class="panel-body"><div class="form-group"><label class="col-sm-3 control-label">审批人</label><div class="col-sm-9"><input type="hidden" class="form-control" placeholder="请输入事由" name="LeaveFormMap.approver" id="approver"value="${leave.approver}"><select name="" id="approverq" class="form-control selectpicker" multiple="true"><option value="${leave.approver}" >${leave.approver}</option><c:forEach items="${list}" var="list"><option value="${list.userName}" >${list.userName}</option></c:forEach></select></div></div><div class="form-group"><label class="col-sm-3 control-label">意见</label><div class="col-sm-9"><textarea name="LeaveFormMap.idea" id="idea" class="form-control"style="width:600px;height:100px;" readonly="readonly">${leave.idea}</textarea> </div></div></div><footer class="panel-footer text-right bg-light lter"><button type="submit" class="btn btn-success btn-s-xs" onclick="fun()">提交</button></footer> </section></form></body>

这样就好了。。