JS控件bootstrap suggest plugin使用方法詳解
更新時(shí)間：2017年03月25日 11:44:48 作者：warrah
這篇文章主要介紹了JS控件bootstrap suggest plugin的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
本文為大家分享了bootstrap-suggest-plugin插件，這是一個(gè)簡(jiǎn)單的編輯提示控件，供大家參考，具體內(nèi)容如下
頁面如下面所示，使用此控件
<div class="form-group">
<label class="col-xs-3 text-right control-label">庫管員:</label>
<div class="col-xs-9">
<div class="input-group">
<input type="text" class="form-control no-padding" id="keeperUserName" value="${keeperUserName}" />
<div class="input-group-btn" style="width:1px;">
<ul class="dropdown-menu dropdown-menu-right" role="menu"></ul>
</div>
</div>
</div>
</div>
js側(cè)這里用到了兩個(gè)字段keeperUserName,keeperUser。其中keeperUser是用來保存用戶數(shù)據(jù)的id，因?yàn)楹芏鄁orm表單保存的數(shù)據(jù)庫中都是數(shù)據(jù)的id，而不是數(shù)據(jù)顯示值。
$('#keeperUserName').bsSuggest({
url:ctx+'/fontalUser/find?filter_likes_name=',
getDataMethod:'url',
effectiveFields:['username','name','phone'],
effectiveFieldsAlias:{username:'用戶賬號(hào)',name:'姓名',phone:'手機(jī)號(hào)'},
showHeader:true,
allowNoKeyword:false,
multiWord:false,
idField:'id',
keyField:'name'
}).on('onSetSelectValue', function (e, keyword, data) {
$('#keeperUser').val(data.id);
});
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- bootstrap suggest搜索建議插件使用詳解
- Bootstrap Search Suggest使用例子
- Bootstrap select多選下拉框?qū)崿F(xiàn)代碼
- Bootstrap select實(shí)現(xiàn)下拉框多選效果
- BootStrap中關(guān)于Select下拉框選擇觸發(fā)事件及擴(kuò)展
- BootStrap下拉框在firefox瀏覽器界面不友好的解決方案
- Bootstrap框架下下拉框select搜索功能
- Bootstrap模塊dropdown實(shí)現(xiàn)下拉框響應(yīng)
- 自定義Angular指令與jQuery實(shí)現(xiàn)的Bootstrap風(fēng)格數(shù)據(jù)雙向綁定的單選與多選下拉框
- bootstrap suggest下拉框使用詳解
相關(guān)文章
本篇文章主要是對(duì)js判斷輸入是否為中文的函數(shù)進(jìn)行了介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2014-03-03
security.js實(shí)現(xiàn)的RSA加密功能示例
這篇文章主要介紹了security.js實(shí)現(xiàn)的RSA加密功能,結(jié)合實(shí)例形式分析了基于security.js進(jìn)行RSA加密的相關(guān)操作技巧,需要的朋友可以參考下2018-06-06
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)車輛管理系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-08-08
js下將字符串當(dāng)函數(shù)執(zhí)行的方法
js下將字符串當(dāng)函數(shù)執(zhí)行的方法，需要的朋友可以參考下。2011-07-07
基于BootStrap柵格欄系統(tǒng)完成網(wǎng)站底部版權(quán)信息區(qū)
網(wǎng)站底部版權(quán)信息區(qū)可以用bootstrap的“柵格系統(tǒng)”完成，下面給大家分享一個(gè)未經(jīng)處理的底部版權(quán)信息區(qū)的樣式，大家可以做個(gè)參考2016-12-12
分頁這種組件，幾乎每一種框架都有這樣的組件，這篇文章主要介紹了MVVM框架下實(shí)現(xiàn)分頁功能示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-06-06
小程序獲取當(dāng)前位置加搜索附近熱門小區(qū)及商區(qū)的方法
這篇文章主要介紹了小程序獲取當(dāng)前位置加搜索附近熱門小區(qū)及商區(qū)的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-04-04
js實(shí)現(xiàn)canvas圖片與img圖片的相互轉(zhuǎn)換的示例
本篇文章主要介紹了js實(shí)現(xiàn)canvas圖片與img圖片的相互轉(zhuǎn)換的示例，具有一定的參考價(jià)值，有興趣的可以了解一下2017-08-08
大家仔細(xì)看下面兩段代碼，代碼一的window.onload = doIt()函數(shù)后面有();而代碼二的window.onload = doIt函數(shù)名后面沒有括號(hào)。2008-09-09
JS基于對(duì)象的鏈表實(shí)現(xiàn)與使用方法示例
這篇文章主要介紹了JS基于對(duì)象的鏈表實(shí)現(xiàn)與使用方法,結(jié)合實(shí)例形式分析了鏈表的原理及javascript定義與使用鏈表的相關(guān)操作技巧,需要的朋友可以參考下2019-01-01