bootstrap select插件 下拉框 、复选框 、使用详解、附.重置 bootstrap-select下拉框复选框中的值/easyui树的复选框中的值。

2 篇文章 0 订阅
2 篇文章 0 订阅

jsp代码

<form id="permForm" method="post"
   action="${path}/workorder/workListStatistics/${branchCode}">
<div class="row-fluid" style="margin-top: 26px;">
<div class="new_span3">
<div class="new_span3">
<div style="margin-top: 10px; margin-right: -19px;">坐席工号:</div>
</div>
<div class="new_span3">
<label> 
<select id="agentEmpcode" name="agentEmpcode" class="selectpicker show-tick form-control" data-width="fit" multiple data-live-search="false" style="width: 600px; height: 30px;">
<c:forEach items="${agents}" var="agents">
<option value="${agents.agentEmpcode}"
<c:if test="${fn:contains(agentEmpcode, agents.agentEmpcode)==true}">selected</c:if>>${agents.agentEmpcode}</option>
</c:forEach>
</select>
</label>
</div>
</div>
<div class="new_span3">
<div class="new_span3" style="width: 100px">
<div style="margin-left: -150px; margin-top: 10px;">座席姓名:</div>
</div>
<div class="new_span3">
<label style="margin-left: -175px;"> <select
id="agentRealname" name="agentRealname"
class="selectpicker show-tick form-control" data-width="fit"
multiple data-live-search="false"
style="width: 150px; height: 30px;">
<c:forEach items="${agents}" var="agents">
<option  value="${agents.agentRealname}"
<c:if test="${fn:contains(agentRealname, agents.agentRealname)==true}">selected</c:if>>${agents.agentRealname}</option>
</c:forEach>
</select>
</label>
</div>
</div>


<div class="new_span3" style="width: 320px">
<div class="new_span3" style="width: 80px">
<div style="margin-left: -290px; margin-top: 10px;">工单类型:
</div>
</div>
<div class="new_span3">
<label style="margin-left: -282px;"> <select
class="easyui-combotree" id="typeId" name="typeId"
data-options="checkbox:true,multiple:true"
style="width: 200px; height: 30px"></select>
</label>
</div>
</div>


<div class="n3_span3"
style="float: left; width: 7%; margin-left: 22px; margin-right: 130px; position: relative;">
<div class="n3_span3"
style="width: 112px; MARGIN-LEFT: -232px; margin-top: 10px;">创建开始时间:</div>
<div class="n3_span3">
<input type="text" name="startTime" id="startTime"
value="<fmt:formatDate value="${startTime}" pattern="yyyy-MM-dd  HH:mm:ss"/>"
onClick="WdatePicker({maxDate:'#F{$dp.$D(\'endTime\')}',dateFmt:'yyyy-MM-dd HH:mm:ss'})"
style="width: 150px; height: 25px; margin-top: -1px; margin-left: -118px;">
</div>
</div>


<div class="n3_span3" style="float: left;">
<div class="n3_span3"
style="margin-left: 1165px; margin-top: -36px;">创建结束时间:</div>
<div class="n3_span3">
<input type="text" name="endTime" id="endTime"
value="<fmt:formatDate value="${endTime}"  pattern="yyyy-MM-dd  HH:mm:ss"/>"
onClick="WdatePicker({minDate:'#F{$dp.$D(\'startTime\')}',dateFmt:'yyyy-MM-dd HH:mm:ss'})"
style="width: 150px; height: 25px; margin-left: 1261px; margin-top: -71px;">
</div>
</div>
</div>


<div class="row-fluid" style="margin-left: -22px;">
<div class="span2" style="float: right">
<button id="workListStatistics" class="btn btn-primary"
type="button" data-toggle="modal" οnclick="search()">搜索</button>
<button class="btn btn-primary" type="button"
οnclick="formReset()" data-toggle="modal">重置</button>
<button class="btn btn-primary" type="button"
οnclick="exportOrderStatisticsList('${branchCode}')" data-toggle="modal">导出</button>
</div>
</div>
</form>
</div>

1.引入js插件在js里面。


2.jsp页面引入样式和js


3.具体下拉框使用



4. bootstrap-select 重置下拉框复选框中的值

    (4.1)   jsp页面


4.2)js代码 表单重置

function formReset() {
$("#permForm input").val('');
$("#permForm select").val('');
$("#typeId").combotree("setValues", "");//easyui树插件的下拉框多选框的值重置
        $("#agentRealname").selectpicker('refresh');//对searchPayState这个下拉框进行重置刷新
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值