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