欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

使用bootstrap實(shí)現(xiàn)下拉框搜索功能的實(shí)例講解

 更新時(shí)間：2018年08月10日 09:11:12   作者：回歸心靈  
今天小編就為大家分享一篇使用bootstrap實(shí)現(xiàn)下拉框搜索功能的實(shí)例講解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧

背景

公司的小二后臺(tái)有一個(gè)下拉框選擇經(jīng)銷商的功能，由于選擇的經(jīng)銷商過(guò)多，因此添加搜索功能。

前提

配置好Bootstrap相關(guān)的開(kāi)發(fā)環(huán)境

主要內(nèi)容

<div class="form-group">
 <label class="col-sm-3 control-label" for="state">經(jīng)銷商信息</label>
 <div class="col-sm-3">
  <select name="dealer_id" id="dealer_id" class="selectpicker show-tick form-control" data-width="98%" data-first-option="false" title='請(qǐng)選擇經(jīng)銷商(必選)' required data-live-search="true">
  <#foreach dealer in dealerList>
  <option value="${dealer.id?c}">${dealer.name!}</option>
  </#foreach>
  </select>
 </div>
</div>

其中最主要的是select標(biāo)簽中的兩個(gè)屬性： class=”selectpicker show-tick form-control” 和 required data-live-search=”true” 。數(shù)據(jù)展示中foreach是模版引擎freemarker的循環(huán)遍歷列表語(yǔ)句，當(dāng)然測(cè)試時(shí)，您可以列幾個(gè)option標(biāo)簽數(shù)據(jù)。

效果圖：

以上這篇使用bootstrap實(shí)現(xiàn)下拉框搜索功能的實(shí)例講解就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論