JS控件bootstrap suggest plugin使用方法详解_网络技术

JS控件bootstrap suggest plugin使用方法详解

发布时间 - 2026-01-11 00:21:50 点击率：次

本文为大家分享了bootstrap-suggest-plugin插件，这是一个简单的编辑提示控件，供大家参考，具体内容如下

bootstrap-suggest-plugin插件地址

页面如下面所示，使用此控件

<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侧这里用到了两个字段keeperUserName,keeperUser。其中keeperUser是用来保存用户数据的id，因为很多form表单保存的数据库中都是数据的id，而不是数据显示值。

 $('#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);
    });

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

# bootstrap # suggest # bootstrap suggest搜索建议插件使用详解 # Bootstrap Search Suggest使用例子 # Bootstrap select多选下拉框实现代码 # Bootstrap select实现下拉框多选效果 # BootStrap中关于Select下拉框选择触发事件及扩展 # BootStrap下拉框在firefox浏览器界面不友好的解决方案 # Bootstrap框架下下拉框select搜索功能 # Bootstrap模块dropdown实现下拉框响应 # 自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选与多选下拉框 # bootstrap suggest下拉框使用详解 # 都是 # 这是一个 # 所示 # 大家分享 # 表单 # 数据库中 # 具体内容 # 大家多多 # 而不是 # 是用来 # gt # label # group # lt # div # form # type # input # id # padding

相关栏目：【网站优化151355 】【网络推广146373 】【网络技术251813 】【 AI营销90571 】

上一篇：Linux如何排查磁盘写入阻塞问题_LinuxIO瓶颈分析

下一篇：grokai如何生成动态图表_grokai动态图表生成工具使

相关栏目网站优化
网络推广
网络技术
AI营销

最新文章 Sublime怎么一键压缩JS代码 Su sublime如何在搜索中使用正则表达式 Sublime如何设置透明窗口效果 Su mysql如何设计商品表结构_mysql css属性背景图不显示怎么办_通过检查路如何使用Golang实现排序_Golan 农历闰月是怎么回事_为合回归年加一月调整塑造《刺客信条》艾吉奥传奇的编剧离开育碧 1英里等于多少公里 1mile和km的换 css grid布局中行和列是如何定义的 PS批量旋转和翻转图片，快速校正图片方向 C# Swagger UI自定义方法 C OPPO手机九宫格和全键盘怎么切换_OP Go语言如何实现用户登录注册_Golan 1节飞行速度多少公里每小时 1节是多少公纸嫁衣8千子树第五章庙门怎么开启庙门 Laravel 多行数据编辑表单中实现逐明日之后如何提升钓鱼等级明日之后提升钓支付宝怎样查年度账单_支付宝年度账单查看 C# 多线程UI更新Dispatcher

上一篇：Linux如何排查磁盘写入阻塞问题_LinuxIO瓶颈分析

下一篇：grokai如何生成动态图表_grokai动态图表生成工具使