bootstrap实现多个下拉框同时搜索的实例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

									<div class="btn-group col-sm-3 col-xs-6 util-btn-margin-bottom-5 quick-search"> 

									       <!--快速查询-->

									       <div class="input-group">

									        <span class="input-group-addon"><i class="fa fa-search"></i></span>

									        <select data-filter-type="2" name="copyfrom" class="form-control select2" data-validate="notempty" style="visibility: hidden;" data-field="name" data-placeholder="搜索数据资源">

									         <option value="">请选择数据资源</option>

									         <optgroup label="UNESCO二类中心">

									          <#list data.copyfromList as entity>

									          <#if (entity.type?? && entity.type == '1')>

									          <option value="${entity.alias!}" <#if (param.copyfrom?? && param.copyfrom == entity.alias)>selected</#if>>${entity.alias!}</option>

									          </#if>

									          </#list>

									         </optgroup>

									         <optgroup label="科技动态与进展">

									          <#list data.copyfromList as entity>

									          <#if (entity.type?? && entity.type == '7')>

									          <option value="${entity.alias!}" <#if (param.copyfrom?? && param.copyfrom == entity.alias)>selected</#if>>${entity.alias!}</option>

									          </#if>

									          </#list>

									         </optgroup>

									         <optgroup label="其他">

									          <#list data.copyfromList as entity>

									          <#if (entity.type?? && entity.type == '8')>

									          <option value="${entity.alias!}" <#if (param.copyfrom?? && param.copyfrom == entity.alias)>selected</#if>>${entity.alias!}</option>

									          </#if>

									          </#list>

									         </optgroup>

									        </select>

									       </div>

									      </div>

1

2

3

4

5

6

7

8

9

10

11

12

									<div class="btn-group col-sm-3 col-xs-6 util-btn-margin-bottom-5 quick-search"> 

									       <!--快速查询-->

									       <div class="input-group">

									        <span class="input-group-addon"><i class="fa fa-search"></i></span>

									        <select data-filter-type="2" name="cid" class="form-control select2" data-validate="notempty" style="visibility: hidden;" data-field="name" data-placeholder="搜索栏目名称">

									         <option value=""></option>

									         <#list data.categories as entity>

									         <option value="${entity.id}" <#if (param.cid?? && param.cid == entity.id)>selected</#if>>${entity.id} - ${entity.name}</option>

									         </#list>

									        </select>

									       </div>

									      </div>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

									bindEvents:function(){

									　　　　var self = this, dom = self.element;

									　　　　$('select[name="copyfrom"]', dom).change(function(event){

									　　　　self.params.copyfrom = $(this).val();

									　　　　var url = self.formatParams(self.params);

									　　　　window.location.href = "cekasp_article.htm" + url;

									　　});

									　　　　$('select[name="cid"]', dom).change(function(event){

									　　　　self.params.cid = $(this).val();

									　　　　var url = self.formatParams(self.params);

									　　　　window.location.href = "cekasp_article.htm" + url;

									　　});

									 }

									　　formatParams:function(params){

									　　　　var self = this;

									　　　　var url = "";

									　　　　for(var param in params){

									　　　　if(params[param]){

									　　　　　　url += param + "=" + params[param] + "&";

									　　　　}

									　　}

									　　　　if(url.length > 0){

									　　　　　　url = "?" + url.substring(0,url.length-1);

									　　}

									　　　　return url;

									　　}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

									String categoryId = request.optString("cid");

									　　if (!ValidateUtil.isNull(categoryId)) {

									　　// 加载栏目信息

									  　　JSONObject jsonCategory = toJSONObject(adminService.loadById(CekaspCategory.class, categoryId));

									　　　　response.put("category", jsonCategory);

									　　　　param.addFilter("id", FilterType.IN, articleIdList, 1);

									　　}

									　　String copyfrom = request.optString("copyfrom");

									　　if (!ValidateUtil.isNull(copyfrom)) {

									　　　　param.addFilter("copyfrom", FilterType.EQUALS, copyfrom);

									  }

									List<CekaspArticle> articleList = adminService.list(CekaspArticle.class,param);

bootstrap实现多个下拉框同时搜索的实例

相关文章

热门资讯